前端vue高频难点面试题

 一、闭包

1.实现方式：方法中使用方法

2.作用
        1.与外界函数沟通的桥梁

        2.延长函数内变量的生命周期，这里涉及到垃圾回收机制，内存泄露由此而生，解决办法是不使用变量时及时销毁变量

        3.开辟私有变量作用域，也是vue必须使用函数式data的原因

二、垃圾回收机制

1.当一个对象没有变量或属性对它进行引用，这种对象就是一个垃圾，会被垃圾回收机制自动回收

2.如果想手动回收某个对象，只需要将不再使用的对象设置为null

三、vue为什么data要写成函数式

1.用到了闭包的特性，使每一个组件都有自己的私有作用域，确保各组件数据不会互相干扰

2.写成函数式每个组件都会开辟一块内存空间，由于函数作用域每个组件间的data不会互相干扰

四、防抖/节流

1.防抖：第一个任务未执行完，同时第二个相同的任务开始执行时，销毁第一个任务（多次任务最终只执行一个任务）

2.节流：第一个任务未执行完，不允许第二个任务执行（一定时间内只执行一个任务）

五、原型/原型链

1.原型（prototype）
    --原型的作用是用来让实例继承方法和属性
    --普通对象、数组没有原型，原型是函数特有的

2.原型链（__proto__）
    --原型链作用是当实例中查找不到某个方法或属性时，按照原型链依次往上查找，最顶层是Object这个对象，再找不到就是null

    --对象、数组、函数都有原型链

六、vue2响应式实现原理

--原理：通过数据劫持 Object.defineProperty + 发布订阅者模式

1.发布订阅者模式，它做了三件事
    （1）创建容器
    （2）添加订阅
    （3）发布

2.Object.defineProperty( )
    --对数据做数据劫持，使用 这个方法添加对象，重写了原有的 get 和 set 方法，这就是数据劫持

七、mvc与mvvm

1.mvc是包括model数据层、view视图层、controller控制层，各部分之间的通信都是单向的

2.mvvm包括model数据层、view视图层、viewmodel层，mvvm各部分之间双向通信，mvvm在概念上是真正将页面与数据逻辑分离的模式

八、虚拟dom

1.什么是虚拟dom？
    --虚拟dom本质上就是一个对象，vue解析tempate模板时会在浏览器渲染出真实dom，此时虚拟dom随之产生

2.虚拟dom有什么作用
    --vue页面的渲染可以分为两种，首次渲染和更新渲染，虚拟dom在首次渲染时产生，所以会拖慢首次渲染；在更新渲染时，虚拟dom会根据页面的更改做新旧dom对比，只更新数据变化的部分，由于虚拟dom本质是一个对象，修改一个对象比直接操作dom节省了很多性能，这也是为什么虚拟dom被推崇的原因

九、diff算法

1.diff算法的过程就是调用名为patch的函数，比较新旧节点，一边比较一边给真实的dom打补丁

2.patch函数，虚拟dom的产生需要三个因素：节点、节点属性、子节点，把创建的虚拟dom节点和真实dom节点对比，如果数据相同就不更改，不同就更改，用vnode.children的方法比较子节点以此类推，再通过递归的方法进行循环判断

九、$nextTick（）

    --延迟回调，确保dom更新之后再调用$nextTick（）中包含的内容

十、v-if与v-for
    1.不能一起使用，会造成性能浪费，原因是v-for优先级>v-if会先循环遍历，强行使用会报错
    2.解决办法是在v-for之外包裹一个template标签v-if写在这个标签里

十一、vue-router与location.href什么区别
    1.location.href是原生js的页面跳转方法，简单方便，会刷新页面，多用于跳外部链接
    2.vue-router使用原生js的history方法，实现了按需加载，减少了dom消耗，多用于内部页面

十二、单页面与多页面的优缺点
    1.单页面（SPA）只有一个主页面的应用，把其他页面分为页面片段，可以局部刷新资源，

    --优点：
        （1）体验好，块
        （2）改动内容，不用加载整个页面
        （3）效果可以很炫酷
    --缺点：
        （1）不利于搜索引擎优化（SEO）    
        （2）初次加载比较慢
        （3）页面复杂度高

    2.多页面：与单页面相反

十三、<keep-alive>
    1.用法：是 Vue 的内置组件，用来包裹<router-view>路由视口的
    2.作用：缓存路由的信息，默认全部路由都会缓存，也可以添加include属性，指定组件名称只缓存某个路由，或exclude，排除缓存某个路由

十四、render函数
--渲染函数
    1.用来创建html，
    2.参数一：h，是一个createElement函数，用于创建节点信息，参数有三个（'el','css',vnodeArr）
    3.参数二：context，代表当前节点下的所有信息