阶段复习-前三周 ### 1\. ES6新语法 更加严谨 * let / const > 和ES5中的VAR的区别 > 1)let不存在变量提升机制（变量不允许在声明之前使用） > 2)let不允许重复声明 > 3)在全局作用域中基于let声明的变量不是window的一个属性，和他没关系 > 4)typeof 未被声明的变量 =>不是undefined而是报错（暂时性死区） > 5)let会形成块级作用域（类似于私有作用域，大部分大括号都会形成块作用域） > … * 解构赋值 * “…” 拓展、剩余、展开运算符 * ES6中的模板字符串 * 箭头函数 > 和普通函数的区别 > 1)没有arguments，但是可以基于…arg获取实参集合（结果是一个数组） > 2)没有自己的this，箭头函数中的this是上下文中的this * Promise（async/await） * class（ES6中创建类的） * interator（for of 循环） * Map / Set * … ### 2. 请说出你对 “重排(回流)和重绘读写分离” 的理解！ > 思路： > 1.首先说出什么是重排和重绘 > 2.突出他们耗性能 > 3.突出自己写项目的时候重点注意了这些事情，以及自己的解决方案（说一下解决原理） 浏览器渲染一个页面的时候是按照“先创建DOM树->在加载CSS->生成渲染树 RENDER TREE->把渲染树交给浏览器（GPU）进行绘制”，如果后期我们修改了元素的样式（但是没有改变大小和位置），浏览器会把当前元素重新生成渲染树，然后重新渲染，这个机制是重绘，但是一旦元素的位置或者大小等发生改变，浏览器就要从DOM树重新计算渲染，这个机制是回流(重排)，不论是重排还是重绘都非常的消耗性能 在我的以前项目中，我特意的重视了这个问题，尽量减少操作DOM引发的回流和重绘问题，常用的解决方案： 1. 需要动态向页面追加元素的时候，基于文档碎片或者先把需要增加的所有元素拼接成字符串，最后统一进行增加 2. 读写分离：把统一修改样式都放到一起执行，新版浏览器都有一个自己检测的机制，如果发现下面紧挨着的操作也是修改元素的样式，会把所有修改的事先存起来，直到遇到非修改样式的操作，会把之前存储的统一执行，引发一次回流和重绘 当然还有一些其它的办法，这些是最常注意的，我认为减少DOM的回流重绘是非常重要的性能优化手段之一