前端小笔记
for ... of是作为ES6新增的遍历方式,允许遍历一个含有iterator接口的数据结构并且返回各项的值。
for...of与 ES3中的for ... in的区别如下:
- for ... of遍历获取的是对象的键值,for ... in 获取的是对象的键名。
- for ... in会遍历对象的整个原型链,性能非常差不推荐使用,而for ... of只遍历当前对象不会遍历原型链。
- 对于数组的遍历,for ... in会返回数组中所有可枚举的属性(包括原型链),for ... of只返回数组的下标对于的属性值。
- for ... of循环的原理其实也是利用了遍历对象内部的iterator接口,将for ... of循环分解成最原始的for循环,内部实现的机制可以这么理解。
往返缓存(Back/Forward cache)
往返缓存是浏览器为了在用户页面间执行前进后退操作时拥有更加流畅体验的一种策略。该策略具体表现为,当用户前往新页面时,将当前页面的浏览器DOM状态保存到bfcache中;当用户点击后退按钮的时候,将页面直接从bfcache中加载,节省了网络请求的时间。
剩余运算符和扩展运算符的区别
剩余运算符和扩展运算符的区别就是,剩余运算符会收集这些集合,放到右边的数组中,扩展运算符是将右边的数组拆分成元素的集合,它们是相反的,ES6语法的环境下不要在使用arguments,使用剩余运算符替代(箭头函数没有arguments,必须使用剩余运算符才能访问参数集合)。扩展运算符可以和数组的解构赋值一起使用,但是必须放在最后一个,因为剩余/扩展运算符的原理其实是利用了数组的迭代器,它会消耗3个点后面的数组的所有迭代器,读取所有迭代器的value属性,剩余/扩展运算符后不能在有解构赋值,因为剩余/扩展运算符已经消耗了所有迭代器,而数组的解构赋值也是消耗迭代器,但是这个时候已经没有迭代器了,所以会报错。