常见面试题（7）

对于普通数据类型一般来说可使用defineproperty，但是对于复杂的数据类型比如说，数组，或者对象这类的引用数据类型来说，就要使用proxy,还有就是使用defineproperty来说无法检测数据的改变，如果想要修改数据的话还需要用到原生的$set等方法，修改完后页面的数据才会发生改变，但对于proxy来说不会发生这样的情况

vuex:vuex就是要实现全局的组件实现组件之间的一个共享状态，一个组件更新之后，其他组件也能接受到一个更新的值

使用：先下载vuex，在main,js中全局导入app.use

场景：就是发现有很多组件都用到某个属性或者方法，就可以存入到vuex中，store就是用来存储的，action就相当于执行的方法，这个里面写的是所要执行的函数，在通过dispatch的形式是各个组件都能拿到

Vue2的响应式原理就是在js下的原生的object.definproty,通过改变数据来触发林里面的get和set方法，在通过消息订阅预发布的形式达到数据与视图的同步更新

Babel 是 JavaScript 编译器：他能让开发者在开发过程中，直接使用各类方言（如 TS、Flow、JSX）或新的语法特性，而不需要考虑运行环境，因为Babel可以做到按需转换为低版本支持的代码；Babel内部原理是将 JS 代码转换为 AST，对 AST 应用各种插件进行处理，最终输出编译后的 JS 代码。

Babel 编译流程:

解析阶段：Babel 默认使用 @babel/parser将代码转换为AST。解析一般分为两个阶段：词法分析和语法分析。

词法分析：对输入的字符序列做标记化(tokenization)操作。

语法分析：处理标记与标记之间的关系，最终形成一颗完整的 AST 结构。

转换阶段：Babel 使用 @babel/traverse 提供的方法对 AST 进行深度优先遍历，调用插件对关注节点的处理函数，按需对 AST 节点进行增删改操作

生成阶段：Babel默认使用 @babel/generator 将上一阶段处理后的 AST 转换为代码字符串。

var是全局声明，let是块级作用的，只适用于当前代码块

var变量会发生变量提升，let则不会进行变量提升

var 会造成重复赋值，循环里的赋值可能会造成变量泄露至全局

let在一个块级作用只能赋一次值，并进行当前代码块的锁区，就是说当前块只有let声明的这个变量是有用的

let在一个块级内，只能声明一个一个相同的变量名

ES6新增了字符串模板，在拼接大段字符串时，用反引号(`)取代以往的字符串相加的形式,能保留所有空格和换行，使得字符串看起来更加直观、优雅。

ES6模板字符串，允许换行和空格，读写性强

ES6在String原型上新增了includes（）方法，用于取代传统只能用indexOf查找包含字符串的方法（indexOf返回-1表示没查到，不如includes（）返回false更明确，语义更清晰），此外还新增了startsWith（）、endsWith（）、padStarts（）、padEnd（）、repeat（）等方法，可更加方便的用于查找、补全字符串

数组的解构赋值

ES6可以直接以下形式进行变量赋值

在声明较多变量时，不需要再写很多let（或var），且映射关系清晰，支持赋默认值。

扩展运算符

ES6新增的扩展运算符（...），可以轻松的实现数组和松散序列（比如集合等）的相互转换，可以取代arguments对象和apply方法，轻松获取未知参数个数情况下的参数集合。（尤其是在ES5即传统js中，arguments不是一个真正的数组，而是一个类数组的对象，但是扩展运算符的逆运算却可以返回一个真正的数组）。扩展运算符还可以轻松实现数组的复制和解构。

ES6在Array原型上新增了find（）方法，用于取代传统只能indexOf()查找数组项目的方法，且修复了indexOf查找不到NaN的bug

此外，还新增了copyWithin()、includes()、fill()、flat()等方法，可方便用于数组的查找，补全，和转换等。

事件循环：在js运行环境中是单线程的，遇到异步任务会阻塞，，事件循环通过判断同步异步任务放入到相对应的执行站中执行，依次的循环执行下去就形成了事件循环。

浏览器内核包括js引擎和渲染引擎，以前的浏览器内核比较偏向于渲染引擎，现在的内核普遍偏向于js引擎。

每个浏览器的内核是不同的，在开发时要注意浏览器内核的适配，比如css样式等。