基于TOP-K的面试题解总结（4）

16.简述 Vue 中 watch 和 computed 的区别

• watch：
• 可以执行任何逻辑，比如节流、Ajax异步数据获取、监听等
• 通过监听某一个属性来影响另一个属性，但不能通过影响了某个属性之后再去影响原来的属性，只能是单向的
• 使用watch监听时，该属性必须存在，没有该属性是无法监听的
• watch还可以监听路由的改变
• 适用于一个数据影响多个数据的情况下
• computed：
• 能够进行数据缓存
• 能够对最终结果进行运算功能
• 适用于一个数据被多个数据影响的情况下

 

17.简述 JavaScript 事件循环机制Event Loop

• 运行机制：
• 所有的任务都在主线程进行，形成执行栈
• 主线程之外有一个任务队列，系统会叫异步任务放在任务队列中
• 待主线程任务执行完成后，系统将会读取任务队列中的任务
• 异步任务结束了等待状态，就会从任务队列进入主线程执行栈，恢复执行
• 主线程重复以上步骤
• 异步任务又分为宏任务和微任务
• 宏任务：setTimeout、script等
• 微任务：Promise（注意new Promise()是同步任务，resolve、catch、then是异步任务）、nextTick等
• 微任务永远比宏任务先执行

 

18.简述 Flex 布局的原理和使用场景

• Flex：弹性布局
• 弹性布局中的元素具有伸展和收缩自身的能力。
• 弹性布局中元素的大小是高度依赖父容器的大小
• 子元素的目标就是为了撑满父元素
• 父元素属性设置：
• display：可以设置为flex
• justifiy-content：定义内部元素在主轴上的对齐方式
• align-items：定义内部元素在交叉轴上的对齐方式
• align-content：定义多根轴线的对齐方式，如果项目只有一个轴线，该属性不起作用。
• 使用场景：流式布局，网格布局，圣杯布局

 

19.简述 Javascript 的数据类型

• Number：数字
• Boolean：布尔值
• object：对象
• null：空
• undefined：未定义
• Symbol：符号

 

20.箭头函数和普通函数的区别是什么？

• 箭头函数  const fn=()=>{}
• 优点：
• 函数定义整洁
• this指向上级作用域
• 可不添加return
• 缺点：
• 不能用于构造函数