菜鸡打卡 （昨天返校鸽了一天）
1.谈谈你对 Vue 的理解
- 它是一个渐进式JavaScript框架
- 核心库加插件
- 动态创建用户界面
- 使用 MVVM 模式
- 代码简洁，体积小能够提高运行效率
- 适合 PC 端和移动端的开发
- 可以轻松引入 vue 插件以及其他第三方库进行开发
2.Vue 的常用指令
- v-text v-text 主要用来更新 textContent，可以等同于 JS 的 text 属性
- v-html 等同于 JS 的 innerHtml 属性
- v-cloak 用来保持在元素上直到关联实例结束时进行编译 解决闪烁问题
- v-once v-once 关联的实例，只会渲 染一次。之后的重新渲染，实例极其所有的子节点将被视为静态内容跳过，这可以用于优化更新性能
- v-if v-if 可以 实现条件渲染，Vue 会根据表达式的值的真假条件来渲染元素
- v-else v-else 是搭配 v-if 使用的，它必须紧跟在 vif 或者 v-else-if 后面，否则不起作用
- v-else-if v-else-if 充当 v-if 的 else-if 块, 可以链式的使用多次。可以更加 方便的实现 switch 语句。
- v-show 也是用于根据条件展示元素。和 v-if 不同的是，如果 v-if 的值是 false，则 这个 元素被销毁，不在 dom 中。但是 v-show 的元素会始终被渲染并保存在 dom 中，它只是简单的切换 css 的 dispaly 属性
- v-for 用 v-for 指令根据遍历数组来进行渲染
- v-bind v-bind 用来动态的绑定一个或者多个特 性。没有参数时，可以绑定到一个包含键值对的对象。常用于动态绑定 class 和 style。以及 href 等。简写为一 个冒号【 ：】
- v-model 用于在表单上创建双向数据绑定
- v-on v-on 主要用来监听 dom 事件，以便执行一些代码 块。表达式可以是一个方法名。简写为【@】
3.Vue 的优缺点
vue 两大特点：响应式编程、组件化。
vue 的优势：轻量级框架、简单易学、双向数据绑定、组件化、数据和结构的分离、虚拟 DOM、运行速度快。 vue 是单页面应用，使页面局部刷新，不用每次跳转页面都要请求所有数据和 dom，这样大大加快了访问速度 和提升用户体验。而且他的第三方 ui 库很多节省开发时间。
这里的响应式不是@media 媒体查询中的响应式布局，而是指 vue.js 会自动对页面中某些数据的变化做出响应。 这也就是 vue.js 大的优点，通过 MVVM 思想实现数据的双向绑定，让开发者不用再操作 dom 对象，有更多的 时间去思考业务逻辑。
组件化开发 Vue.js 通过组件，把一个单页应用中的各种模块拆分到一个一个单独的组件（component）中，我 们只要先在父级应用中写好各种组件标签（占坑），并且在组件标签中写好要传入组件的参数（就像给函数传入 参数一样，这个参数叫做组件的属性），然后再分别写好各种组件的实现（填坑），然后整个应用就算做完了。 组件化开发的优点：提高开发效率、方便重复使用、简化调试步骤、提升整个项目的可维护性、便于协同开发。
4. v-if 和 v-show
v-if显示隐藏是将 dom 元素 真个添加或删除，而v-show 隐藏则是为了该元素添加display：none， dom元素还在。
5.简单谈一下双向数据绑定原理
MVVM 模式 MVVM 模式就是 Model–View–ViewModel 模式。它实现了 View 的变动，自动反映在 ViewModel，反之亦然。就是在单向绑定的基础上给可输入元素（input、textare 等）添加了 change(input)事 件,(change 事件触发，MVVM 模式 MVVM 模式就是 Model–View–ViewModel 模式。它实现了 View 的变动，自动反映在 ViewModel，反之亦然。就是在单向绑定的基础上给可输入元素（input、textare 等）添加了 change(input)事 件,(change 事件触发。
6. 双向绑定原理
vue 数据双向绑定是通过书籍劫持结合发布者-订阅者的方式来实习的。实现数据的双向绑定，首先要对数据进行劫持监听，所以需要设置一个监听器Observer，用来监听所有属性。
如果属性发生了变化了，就需要告诉订阅者Watcher看是否需要更新。因为订阅者是有很多个，所以血药有一个消息订阅器Dep来专门收集哲学订阅者，然后在监听器Observer和订阅者Watcher之前进行统一管理的。
接着，还需要一个指令解析器Compile，对每个节点元素进行扫描和解析，将相关指令（如v-model，v-on）对应初始化成一个订阅者Watcher，并替换模板数据或者绑定相应函数，此时当订阅者Watcher接收到相应属性的变化，就会执行对应的更新函数，从而更新视图。
总结成三个步骤：
-
实现一个监听器 Observer，用来劫持并监听所有属性，如果有变动的，就通知订阅者。
-
实现一个订阅者 Watcher，每一个 Watcher 都绑定一个更新函数，watcher 可以收到属性的变化通知并执行 相应的函数，从而更新视图。
-
实现一个解析器 Compile，可以扫描和解析每个节点的相关指令（v-model，v-on 等指令），如果节点存在 v-model，v-on 等指令，则解析器 Compile 初始化这类节点的模板数据，使之可以显示在视图上，然后初始化相 应的订阅者（Watcher）。
7.computed 和 watch 有什么区别？
计算属性 computed：
支持缓存，只有依赖数据发生变化时，才会重新进行计算函数；
计算属性内不支持异步操作；
计算属性的函数 中都有一个 get(默认具有，获取计算属性)和 set(手动添加，设置计算属性)方法；
计算属性是自动监听依赖值的 变化，从而动态返回内容。
侦听属性 watch：
不支持缓存，只要数据发生变化，就会执行侦听函数；
侦听属性内支持异步操作；
侦听属性的值可以是一个对象，接收 handler 回调，deep，immediate 三个属性；
监听是一个过程，在监听的值变化时，可以触发一个回 调，并做一些其他事情。
computed 是计算属性，它会根据你所依赖的数据动态显示新的计算结果 watch 一个对象，键是 data 对应的数 据，值是对应的回调函数。值也可以是方法名，或者包含选项的对象，当 data 的数据发生变化时，就会发生一 个回调，他有两个参数，一个 val （修改后的 data 数据），一个 oldVal（原来的 data 数据） Vue 实例将会在实 例化时调用$watch()，遍历 watch 对象的每一个属性 区别： 1、计算属性在调用时需要在模板中渲染，修改计 算所依赖元数据；watch 在调用时只需修改元数据。 2、计算属性默认深度依赖，watch 默认浅度观测。 3、计 算属性适合做筛选，不可异步；watch 适合做执行异步或开销较大的操作。
8.vue 中 methods、watch、computed 之间的差别对比以及适用场景
computed:当页面中有某些数据依赖其他数据进行变动的时候，可以使用计算属性。
watch: watch 和 computed 很相似，watch 用于观察和监听页面上的 vue 实例，当然在大部分情况下我们都会使用 computed，但如果要在数据变化的同时进行异步操作或者是比较大的开销，那么 watch 为 佳选择。watch 为 一个对象，键是需要观察的表达式，值是对应回调函数。值也可以是方法名，或者包含选项的对象。直接引用文 档例子.
methods: 跟前面的都不一样，我们通常在这里面写入方法，只要调用就会重新执行一次，相应的有一些触发条件， 在某些时候 methods 和 computed 看不出来具体的差别，但是一旦在运算量比较复杂的页面中，就会体现出不 一样。
需要注意的是，computed 是具有缓存的，这就意味着只要计算属性的依赖没有进行相应的数据更新，那么 computed 会直接从缓存中获取值，多次访问都会返回之前的计算结果。
计算是通过变量计算来得出数据。而观察是观察一个特定的值，根据被观察者的变动进行相应的变化，在特定的 场景下不能相互混用，所以还是需要注意 api 运用的合理性和语义性。
9.请求接口所在生命周期
接口请求一般放在 mounted 中，但需要注意的是服务端渲染时不支持 mounted，需要放到 created 中 数据更新了页面没有渲染怎么办 this.$forceUpdate()是 vue 强制更新，调用它会强制性更新数据，触发 updated 生命周期。
10.vue 和 react 的区别（简单阐述）
-
核心思想不同 Vue 早期开发就尤雨溪大佬，所以定位就是尽可能的降低前端开发的门槛，让更多的人能够更 快地上手开发。这就有了 vue 的主要特点：灵活易用的渐进式框架，进行数据拦截/代理，它对侦测数据的变化 更敏感、更精确。
-
组件写法差异 React 推荐的做法是** JSX + inline style**, 也就是把 HTML 和 CSS 全都写进 JavaScript 中即 all in js; Vue 推荐的做法是 template 的单文件组件格式(简单易懂，从传统前端转过来易于理 解),即 html,css,js 写在同一个文件(vue 也支持 JSX 写法) 这个差异一定程度上也是由于二者核心思想不同而导致的。
