6. vue3预习

前端框架及项目面试聚焦Vue/React/Webpack — 课程笔记

第6章 Vue3预学习

6-1 vue3要来了vue2就过时了吗

Vue 3升级内容

1. 全部使用ts重写（响应式、vdom、模板编译等）2. 性能提升，代码量减少3. 会调整部分API

Vue 2.x马上就要过时了吗？

1. Vue 3从正式发布到推广开来，还需要一段时间2. Vue  2.x应用范围非常广，有大量项目需要维护、升级3. Proxy存在浏览器兼容性问题，且不能polyfill

热门知识点

Proxy重写响应式

Object.defineProperty的缺点

1. 深度监听需要一次性递归2. 无法监听新增属性/删除属性（Vue.set Vue.delete）3. 无法原生监听数组，需要特殊处理

基本应用

6-2 Proxy 基本使用-part1

proxy-demo.js

6-3 Proxy 基本使用-part2

Reflect作用

1. 和Proxy能力一一对应2. 规范化、标准化、函数式3. 替代掉Object的工具函数

通过对比体会Reflect的作用

代替Object工具函数

规范化标准化

6-4 vue3用Proxy实现响应式

proxy-observe.js

proxyConf

对比

proxy-observe.js ， 在proxyConf的get触发时，才深度递归

observe.js defineReactive observer(value)  一次性递归完成

总结

Prxoy实现响应式1. 深度监听，性能更好2. 可监听 新增/删除属性3. 可监听数组变化

Proxy能规避Object.defineProperty的问题Proxy无法兼容所有浏览器，无法polyfill