面试了许多求职者，很多求职者只知其然，而不知所以然，写此文章为广大前端小伙伴指引迷津。纯干货！纯干货！纯干货！
目录
Vue3小结
Vue3小结
答：Setup、Typescript、Proxy、Composition、性能优化。
setup
答: 新增生命周期setup,setup执行的时机是在beforeCreate生命函数之前执行,使用vue3时候，建议用setup代替beforeCreate、created。
Typescript
Ts强类型语言，可以清晰的了解数据结构等。
与编译器相结合，可以在编写阶段就报错，代码效率有了极大提升。。
Proxy
在vue2中使用Object.defineProperty的时候，遇到的问题有：
- 一次只能对一个属性进行监听。(遍历监听所有属性)
- 在遇到一个对象的属性还是一个对象的情况下，需要递归监听。
- 对于对象的新增属性，需要手动监听。(vue$set方法)
- 对于数组通过push、unshift方法增加的元素，也无法监听。(对数组无法监听的方法重写)
这些问题在Proxy中都轻松得到了解决
语法：const p = new Proxy(target, handler) 参数:
- target:要使用
Proxy包装的目标对象（可以是任何类型的对象，包括原生数组，函数，甚至另一个代理） - handler:一个通常以函数作为属性的对象，各属性中的函数分别定义了在执行各种操作时代理
p的行为。
//定义一个需要代理的对象
let person = {
age: 0,
school: '西电'
}
//定义handler对象
let hander = {
get(obj, key) {
// 如果对象里有这个属性，就返回属性值，如果没有，就返回默认值66
return key in obj ? obj[key] : 66
},
set(obj, key, val) {
obj[key] = val
return true
}
}
//把handler对象传入Proxy
let proxyObj = new Proxy(person, hander)
// 测试get能否拦截成功
console.log(proxyObj.age)//输出0
console.log(proxyObj.school)//输出西电
console.log(proxyObj.name)//输出默认值66
// 测试set能否拦截成功
proxyObj.age = 18
console.log(proxyObj.age)//输出18 修改成功
Composition
答：组合API，类似于React Hook，书写自由，简化逻辑复用。
性能优化
- 引入了Tree-Shaking，Tree-Shaking带来的bundle体积更小是显而易见的。
- nextTick、set、delete等要使用es6引入，打包时对没有用到API进行剔除。
vdom的重写，例如编译模板的静态标记不再进行diff比较、事件缓存等。
