vue面试题目,proxt,composition,hook

2. defineProperty和proxy的区别

Vue 在实例初始化时遍历 data 中的所有属性，并使用 Object.defineProperty 把这些属性全部转为 getter/setter。这样当追踪数据发生变化时，setter 会被自动调用。Object.defineProperty 是 ES5 中一个无法 shim 的特性，这也就是 Vue 不支持 IE8 以及更低版本浏览器的原因。但是这样做有以下问题：1添加或删除对象的属性时，Vue 检测不到。因为添加或删除的对象没有在初始化进行响应式处理，只能通过$set 来调用Object.defineProperty()处理。2无法监控到数组下标和长度的变化Vue3 使用 Proxy 来监控数据的变化。Proxy 是 ES6 中提供的功能，其作用为：用于定义基本操作的自定义行为（如属性查找，赋值，枚举，函数调用等）。相对于Object.defineProperty()，其有以下特点：1Proxy 直接代理整个对象而非对象属性，这样只需做一层代理就可以监听同级结构下的所有属性变化，包括新增属性和删除属性。2Proxy 可以监听数组的变化。

并且使用Objct.definePropery将这些属性全部转换成为etter,setter

proxy直接代理珍格格对象而非对象属性，这样只需要做一层代理就可以监听同级结构下的所有的属性变化，包括新增属性和山属性

vue3 proxy二proxy是窗机你对象的虚拟表示，并且提供set,get和deleteProperty等处理器，

对于集合类型就是对集合对象的方法做一层包装，原先的方法执行万以后执行依赖相关的手机和处罚逻辑

Composition api本质上就是意见options api背后的机制暴露给用户直接私用

5. Composition API与React Hook很像，区别是什么

从React Hook的实现角度看，React Hook是根据useState调用的顺序来确定下一次重渲染时的state是来源于哪个useState，所以出现了以下限制●不能在循环、条件、嵌套函数中调用Hook●必须确保总是在你的React函数的顶层调用Hook●useEffect、useMemo等函数必须手动确定依赖关系而Composition API是基于Vue的响应式系统实现的，与React Hook的相比●声明在setup函数内，一次组件实例化只调用一次setup，而React Hook每次重渲染都需要调用Hook，使得React的GC比Vue更有压力，性能也相对于Vue来说也较慢●Compositon API的调用不需要顾虑调用顺序，也可以在循环、条件、嵌套函数中使用●响应式系统自动实现了依赖收集，进而组件的部分的性能优化由Vue内部自己完成，而React Hook需要手动传入依赖，而且必须必须保证依赖的顺序，让useEffect、useMemo等函数正确的捕获依赖变量，否则会由于依赖不正确使得组件性能下降。虽然Compositon API看起来比React Hook好用，但是其设计思想也是借鉴React Hook的

从rect hook的实现角度，react hook是根据useState调用的顺序来确定下次重新渲染的时候的sare来源于那个useState所以出现了一下限制

react hook需要手动传入依赖，必须保证依赖的顺序，让useEffect,useMemo等函数正确的捕获依赖变量，否则由于依赖不正确是的组件性能下降

借助虚拟dom,跨平台，比如node.js就没有dom如果想要实现ssr,那么一个方式就是接祖虚拟dom,虚拟dom都会缓存一份，变化的时候现在的虚拟dom回合缓存的虚拟dom进行比较，

现代框架的一个基本要求就是不需要手动操作dom一方面是因为手动操作dom无法保证程序的性能

虚拟dom的解析流程：首先要对插入到文档当红的dom结构记性分析使用js对象将其表示粗来，比如一个元素对象，包含tagName,props,chldren这些属性，然后将这个

首先要对插入到文档当中的dom树结构进行分析，使用js对象兼顾表示出俩比如一个元素对象，当页面的状态发生改变

为什么要用到虚拟dom

保证性能下线，在不进行手动优化情况下，提供过得去性能

解析html->生产dom->生产cssom>layout->paintcompiler

真实dom:生成1html字符串+重建所有的dom元素

生产大量的dom的是偶多了一层虚拟dom会比innerTML插入慢

virtual dom的更新dom的准备工作耗费更多时间，js层面，相比于更多的dom操作他的消费及其便宜的