前端面试自己要加强的

1.面向对象是什么？

本质就是封装，继承，多态

封装一些组件实现代码复用的实现，简洁代码

继承，继承一些父类身上的属性和方法（原型链搭边）

2.Vue的组件data为什么必须是一个函数

同一个组件的多个组件实例的 data 必须是不同的对象 ( 内容初始数据可以相同 )

如果是 data 是对象 , 组件的多个实例共用一个 data 对象

如果是函数 , 组件对象通过调用函数得到的一个新的 data 对象

3.虚拟dom和diff算法（最头疼的）

虚拟dom本质就是一个js对象，它用来代替真实的Dom为了减少服务器的压力和页面渲染的压力

diff算法本质就是前后的新旧dom进行对比，看看哪个dom更合适

4.请说明key的作用和原理

1. 虚拟 DOM 的 key 的作用 ?

（1). 简单的说 : key 是虚拟 DOM 对象的标识 , 在更新显示时 key 起着极其重要的作用

2. key 为 index 的问题

1). 添加 / 删除 / 排序 => 产生没有必要的真实 DOM 更新 ==> 界面效果没问题 , 但效率低

2). 如果 item 界面还有输入框 => 产生错误的真实 DOM 复用 ==> 不仅效率低 , 界面效果也有问题

注意 : 如果不存在添加 / 删除 / 排序操作 , 用 index 没有问题

5.nextTick的理解

是什么 ?

官方描述 : 在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM

在数据更新后 , 调用 nextTick(callback), 在 callback 中才可以读取到更新后的 DOM

使用场景 ?

更新数据后 , 想操作更新后的 DOM 前台 PC 项目

1. 有哪些功能模块?

2. 使用了哪些库?

项目功能 1: 使用 swiper 实现动态轮播

项目功能 2: 动态显示 input 输入框后 , 需要自动获取焦点

原理 ?

更新数据后, DOM不会立即更新, 而是在所有数据都变化完后, 将DOM更新作为一个异步任务统一执行

理解 Tick: 取出队列中的一个回调任务到调用栈中执行就是一个 tick, 有时也指定队列中的一个回调任务

nextTick(callback): 将 callback 指定为下一个异步回调任务执行

为什么要先更新数据再调用 nextTick() 呢 ?

第一个数据更新才触发将 DOM 更新放入任务队列

这样 nextTick 指定的 callback 就是放在 DOM 更新任务之后

这样 callback 中才能读取到更新后的 DOM

nextTick 中用的是哪个异步技术呢 ?

简单说 : 优先使用微任务 , 如果不支持才选择宏任务

详细说 : promise => MutationObserver => setImmediate => setTimeout