JavaScript 进阶（四）

一、深浅拷贝

1.  浅拷贝

注意：浅拷贝适合单层，不适合里面嵌套了复杂类型的

①、{... obj } 浅拷贝

拷贝后的对象，进行了修改，不会影响原对象的值

②、Object.assign（ ，） 把后面的拷贝到前面

拷贝后的对象，进行了修改，也不会影响原对象的值

【总结】

2.  深拷贝

（1）通过递归实现深拷贝

如果属性值不是数组时，用黄框中的数据进行处理

如果属性值是数组时，怎么处理

是把数组取出来，再次遍历，然后装到新数组里面

注意：k 是个变量，变量只能用中括号的形式进行赋值

注意：应该先用蓝框中的部分把数组筛选走，再用黄框中的部分把对象筛选出来

数组属于对象，所以要先筛选数组

【总结】

深拷贝需要用到函数递归，可以做到新对象不影响旧对象。

当普通拷贝时，直接进行拷贝就好了，如果是数组，则再次调用这个递归函数就可以了

如果是对象，则再次用递归把对象解决

先 arr 后 对象

（2）js库lodash里面cloneDeep内部实现了深拷贝

（3）通过JSON.stringify( )实现

蓝框中把对象变为字符串，黄框中把字符串在变成对象

【总结】

二、异常处理

1.  throw 抛异常

2.  try /catch 捕获异常

finally 后面的代码就不执行了

【总结】

3.  debugger

三、处理 this

1.  this 指向

（1）普通函数的 this 指向谁

【例如】

【总结】

（2）箭头函数 thixs 指向

【注意情况】

【总结】

2.  改变 this

（1）call

（2）apply（ ）

必须以数组形式来传递数据

【使用场景】求数组最大值

注意：可以为空，但是不能省略

【总结】

（3）bind（ ）

【总结】

四、性能优化

1.  防抖

【案例】

（1）lodash 

① 引入库

② 添加事件

（2）手写防抖函数

【代码】

为了鼠标每移动一次，都执行一次匿名函数的内容

t 就是 500

2.  节流 throttle

节流方法

【案例】

（1）lodash 

【总结】

（2）手写防抖函数

注意：第一次判断有没有定时器，没有定时器，就开一个定时器

时间到了，就清除定时器

下一次判断的时候，没有定时器，就再开一次定时器

注意：在set Time out中是 无法删除 定时器的

因为定时器还在运作，所以使用 timer = null 而不是 clearTimeout ( timer )

【总结】

五、【综合案例】

注意：throttle 不管鼠标经过多少次，都只执行一次

一秒打印一次

时间有变化，就触发这个事件

【代码】

【总结】

好啦！本次的分享到这里就结束啦！！！JS部分的学习到这里也就结束啦！！！撒花撒花！

我们下次分享不见不散哦！！！