![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
czx_2019
这个作者很懒,什么都没留下…
展开
-
通过js在ul中插入10000个li,点击li打印出li的序号
第一种 直接ul插入 花费了119ms-164ms window.onload = function () { let now = new Date() let ul = document.querySelector('.ul') for (let i = 0; i < 10000; i++) { let li = document.createElement('li')原创 2020-11-27 23:35:44 · 849 阅读 · 0 评论 -
Array.prototype.slice.call(arguments)、Array.prototype.shift.call(arguments)
Array.prototype.slice(begin, end)作用:slice() 方法返回一个新的数组,由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。原始数组不会被改变。但今天的主题不是它。而是Array.prototype.slice.call(arguments)Array.prototype.slice.call(arguments)作用: 它的作用是把对象/集合转换成数组例子1 <div></div> &原创 2020-10-24 19:40:33 · 1183 阅读 · 0 评论 -
Object.create和new操作符的区别
只传第一个参数var obj = Object.create({a: 1, b: 2, c: 3})console.log(obj)var obj = Object.create({ a: 1, b: 2, c: 3 }, { d: 4, e: 5 })console.log(obj)传两个参数var obj = Object.create({ a: 1, b: 2, c: 3 }, { d: { value: 4 }, e: { value: 5 } })conso..原创 2020-10-23 01:18:39 · 334 阅读 · 0 评论 -
Object.prototype.toString.call(obj)
使用typeof bar === "object"检测”bar”是否为对象有什么缺点?如何避免?用 typeof 是否能准确判断一个对象变量,答案是否定的,null 的结果也是 object,数组的结果也是object,有时候我们需要的是 “纯粹” 的 object 对象。如何避免呢?比较好的方式是:console.log(Object.prototype.toString.call(obj) === "[object Object]");使用以上方式可以很好的区分各种类型:console.原创 2020-10-22 22:55:38 · 171 阅读 · 0 评论 -
关于 JSON.parse(JSON.stringify(obj)) 实现深拷贝的一些坑
这种实现深拷贝的方法有局限性,它只适用于一般数据的拷贝(对象、数组),有以下情况需要注意:1.如果json里面有时间对象,则序列化结果:时间对象=>字符串的形式;let obj = { age: 18, date: new Date()}let objCopy = JSON.parse(JSON.stringify(obj));console.log('obj', obj)console.log('objCopy', objCopy)console.log(typeo原创 2020-10-21 22:01:03 · 461 阅读 · 1 评论 -
snabbdom展示虚拟dom魅力
snabbdom可以很好的展示出虚拟dom,虚拟dom是个抽象的概念,dom操作对于浏览器性能消耗是非常大的,虽然目前浏览器性能已经可以很大程度上忽略这一损耗,但虚拟dom带来的性能提升却是非常大的。下面的例子很好的展示了虚拟dom的实现过程,以前我们用js或者jquery操作dom元素通常是更新一大块的dom元素,而snabbdom则是有变化则更新dom,没有变化则不更新dom效果图需求: 根据数据data生成如下表格,点击chang按钮,更改张三名字为小王,更改李四的年龄age为9..原创 2020-10-19 19:45:54 · 140 阅读 · 0 评论 -
hasOwnProperty
JavaScript hasOwnProperty() 方法是 Object 的原型方法(也称实例方法),它定义在 Object.prototype 对象之上,所有 Object 的实例对象都会继承 hasOwnProperty() 方法。hasOwnProperty() 方法用来检测一个属性是否是对象的自有属性,而不是从原型链继承的。如果该属性是自有属性,那么返回 true,否则返回 false。换句话说,hasOwnProperty() 方法不会检测对象的原型链,只会检测当前对象本身,只有当前对象本身原创 2020-10-19 17:34:06 · 201 阅读 · 0 评论 -
原生js页面滚动动画,使用了requestAnimationFrame(电商网站常见的页面滚动)
需求: 1 页面滚动到对应板块,左侧对应的索引高亮2 点击左侧的索引,滚动到对应的板块代码如下,直接拷贝到html文件就可以使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>.原创 2020-10-12 17:22:31 · 947 阅读 · 0 评论 -
background-position设置百分比无效
这是MDN官网对background-position属性的解释,而且有它的计算原理,感兴趣的自己去查。解决方案就是容器和图片的大小不要一样大就可以了。原创 2020-10-11 15:41:09 · 388 阅读 · 0 评论