VUE

vue生命周期

vue数据双向绑定

vue虚拟dom 

computed和watch运行机制1

computed和watch运行机制2

vue30道面试题

VUE面试点：

需要熟悉：生命周期，钩子函数，钩子函数参数

单文件开发（需要使用webpack，项目暂时无法使用  例子：http://div.io/topic/1701）

v-if 对条件块会创建、销毁、创建

v-show 一开始就会创建组件，根据css属性display来显示、隐藏条件块

prop

单向数据流  --  当父组件更新时，子组件中的所有prop都会更新会最新的值，所以不应该在子组件中更改prop。子组件通过$emit 自定义事件通向父组件发通知。    

子组件中可以用data属性存储prop，也可以使用计算属性来转换prop。

computed和watch运行机制：

https://segmentfault.com/a/1190000016368913

https://juejin.im/post/5d59f2a451882549be53b170

watch允许异步操作

为什么vue不能给数组元素直接赋值呢？

vue的双向绑定是通过object.defineProperty给对象添加setter/getter方法实现的。object.defineProperty是针对已有项的设置，数组中新加的项是不会被设置的，也不会触发响应。data中的属性是预先定义好的。

动态添加的数组项不能被劫持而产生响应，给数组的每一项做劫持，性能低且笨拙。

vue生命周期

vue生命周期

keep-alive的了解？

https://cn.vuejs.org/v2/api/#keep-alive

组件中的data为什么是一个函数？而不是对象？

组件是复用的，并且js里对象是引用关系，如果组件data是对象，作用域就没隔离，子组件中的data属性值会相互影响。

如果组件data是函数，每个组件实例都返回一份对象的独立拷贝，组件实例间的data属性就不会相互影响。
而new vue的实例只有一份，是不会被复用的，所以不存在引用对象的问题。

v-model的原理？

v-mode本质上是语法糖，它为不同的输入元素使用不同的属性并且抛出不同的事情。

text和textarea使用value属性和input事件

checkout和radio使用checked属性和change事件

select将value作为prop，并将change作为事件

vue组件间通信方式？

props和$emit 父子间通信。

ref和$parent/$children

eventbus($emit和$on)--一个空vue实例，用它来触发事件和监听事件，父子、兄弟、隔代组件间都可以通信。

$attrs和$listeners--

provide和inject--

vuex

你使用过vuex吗？

vue-router的路由模式有几种？

能说下 vue-router 中常用的 hash 和 history 路由模式实现原理吗？

1.hash模式实现原理--hash路由模式实现主要基于以下几个特性

早期前端路由是由 location.hash 实现的。 location.hash 的值就是URL#后面的内容，#是用来指导浏览器动作的，对服务端无用，发送的请求中不带有#。只改变#后面的内容，不会刷新页面，页面会滚动到#指定的锚点位置。

hash每次改变，会在浏览器的访问历史中增加一个记录（IE6、7不支持），所以可以通过浏览器前进、回退按钮控制hash的切换。

可以通过a标签，设置href属性，用户点击标签后hash会发生变化。或者使用javascript对location.hash复制来URL hash。

html5事件onhashchange 监听hash的变化，从而对页面进行跳转（渲染）。

2.history模式实现的原理--

html5提供了history api来实现URL变化。history.pushState和history.replaceState，这两个api在不刷新的情况下，操作浏览器的历史记录。history.pushState是新增一条历史记录，history.replaceState是替换当前的历史记录。

window.history.pushState(null, null, path);window.history.replaceState(null, null, path);

history路由模式实现主要基于以下几个特性

pushState和replaceState两个api来操作实现url变化。

使用popstate监听url变化，从而对页面进行跳转（渲染）

pushState和replaceState不会触发popstate，需要手动触发页面跳转（渲染）

什么是MVVM？

https://juejin.im/post/5d421bcf6fb9a06af23853f1

vue怎么监听对象和数组的？

-- object.defineProperty只能劫持属性。不能劫持整个对象和数组，vue通过遍历数组和递归遍历对象，利用object.defineProperty对数组和独享实现数据监听。