【校招VIP】前端校招考点之响应式原理-订阅、绑定和劫持

考点介绍：

Vue.js是通过数据劫持以及结合发布者-订阅者来实现双向绑定的，数据劫持是利用ES5的Object.defineProperty(obj, key, val)来劫持各个属性的的setter以及getter，在数据变动时发布消息给订阅者，从而触发相应的回调来更新视图。

本期分享的内容分为试题、文章及视频三部分，答案详情解析和文章内容点击文章末尾链接即可查看！

一、考点题目

1、Vue 响应式怎么实现 ？

解答：当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项，Vue 将遍历此对象所有的属性，并使用 Object.defineProperty 把这些属性全部装换为 getter / setter 。Object.defineProperty 是 ES5 中一个无法 shim 的特性，这也就是为什么 Vue 不支持 IE8 以及更低版本浏览器的原因......

2、用于绑定DOM属性的指令是（ ）

A.v-on

B.v-model

C.v-bind

D.v-html

正确答案：C，定DOM属性的指令是v-bind.....

3、以下属于Vue绑定事件的指令是（ ）

A.v-bind

B.@

C.v-on

D.1

正确答案：BC，绑定事件有两种方式：第一种，通过v-on指令.....

4、关于Vue双向数据绑定说法错误的是（ ）

A.Vue实现双向数据绑定是采用数据劫持和发布者-订阅者模式

B.Object.defineProperty(obj,key,val)可以监听数组变化，不需要做特殊处理

C.Vue2.0 数据劫持是利用ES5的Object.defineProperty(obj,key,val)方法来劫持每个属性的getter和setter

D.用户更新了View，Model的数据也自动被更新了，这种情况就是双向数据绑定

正确答案：B，Object.defineProperty(obj,key,val)不可以监听数组变化，需要做特殊处理.....

二、考点文章

1、【校招VIP】Vue响应式原理探究之“发布-订阅”模式

在面试题中经常会出现与“发布订阅”模式相关的题目，比如考察我们对Vue响应式的理解，也会有题目直接考验我们对“发布订阅”模式或者观察者模式的理解，甚至还会有一些手写算法题。笔者就在今年三月参加某安全公司的面试时被要求手写代码实现“发布订阅”模式，当时由于没有准备没有回答上来，悔不该当初。由此可见“发布订阅”模式是一个非常重要的设计模式，接下来我们一起学习下吧……

2、【校招VIP】Vue响应式原理---双向绑定

Vue最独特的特性之一，是其非侵入行的响应式系统。数据模型仅仅是普通的JavaScript对象，而当修改它们时，视图会进行更新……

3、【校招VIP】使用Object.defineProperty进行数据劫持,实现响应式原理-剖析vue2.0

数据响应式是vue的特性之一，在面试过程中也会常常被问起响应式原理，现在就让我们深入了解一下vue2.0中如何实现响应式……

三、考点视频

1、浮动和清除浮动的三种主要方法

只要做过简单CSS项目的同学，都会遇到浮动的问题，也就是子元素脱离了父元素，导致父元素的高度出现问题。解决方法也很多，最主要的有三种，校招面试时能回答上这三种就满分……

相关题目及解析内容可点击下方链接查看：
PC端链接：https://xiaozhao.vip/dTopic/detail/1357
移动端链接：https://m.xiaozhao.vip/dTopic/detail/1357