前端面试一

•  $nextTick的使用               

          vue中的数据和dom渲染由于是异步的，要想dom结构随数据改变，都应放进this.$nextTick()的回调函数中。在视图更新之后会自动调用$nextTick的回调函数。

        created()中使用方法时，dom还没有被渲染，所以， created()钩子函数进行DOM操作一定要放在this.$nextTick()的回调函数中。

        this.$nextTick()起到一个等待数据的作用，将一些回调延迟，等DOM更新之后在执行

• v-for中key的作用

         提高渲染性能，避免数据混乱

        解析：vue在更新渲染过的元素时，会最大限度的复用原有元素。

                   key相当于vue对DOM的标记，如果用的是index，当数组中某一项被删除时，在这一项之后的所有元素都会改变，在vue的新旧DOM树对比中，就会识别为删除元素后的所有元素改变了，会重新创建这些元素，如果使用的是id作为key值，那么在数组元素被删除时，其他元素都是不受影响的，更新DOM也会大幅度降低

•   typeof和instanceof的区别        

        typeof判断所有变量的类型，返回值有number，boolean，string，function，object，undefined。

        typeof对于丰富的对象实例，只能返回"Object"字符串。

        instanceof用来判断对象，代码形式为obj1 instanceof obj2（obj1是否是obj2的实例），obj2必须为对象，否则会报错！其返回值为布尔值

•  Vuex页面刷新数据丢失怎么解决

        需要做vuex数据持久化，一般使用本地存储的方案来保存数据，可以使用自己设计的存储方案，也可以使用第三方插件

•  watch和computed的区别             

        watch监听属性本身，而computed监听的时依赖项，computed有缓存机制，在依赖项不发生变化的情况下重复调用，不会重复计算

1、区别

watch中的函数是不需要调用的

computed内部的函数调用的时候不需要加()

watch  属性监听 监听属性的变化

computed:计算属性通过属性计算而得来的属性

watch需要在数据变化时执行异步或开销较大的操作时使用

对于任何复杂逻辑或一个数据属性在它所依赖的属性发生变化时，也要发生变化，这种情况下，我们最好使用计算属性computed。 

computed 属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。主要当作属性来使用；

computed中的函数必须用return返回最终的结果

当computed中的函数所依赖的属性如果没有发生改变的时候，那么调用当前函数的时候结果会从缓存中读取

watch 一个对象，键是需要观察的表达式，值是对应回调函数。主要用来监听某些特定数据的变化，从而进行某些具体的业务逻辑操作；

2、使用场景

computed 　　　　

　　　　当一个属性受多个属性影响的时候就需要用到computed

　　　　最典型的例子： 购物车商品结算的时候

watch

　　　　当一条数据影响多条数据的时候就需要用watch

　　　　搜索数据