VUE面试题汇总（九），2024年最新金三银四大厂面经总结

先自我介绍一下，小编浙江大学毕业，去过华为、字节跳动等大厂，目前阿里P7

深知大多数程序员，想要提升技能，往往是自己摸索成长，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年最新Web前端全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上前端开发知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以添加V获取：vip1024c （备注前端）

正文

唯一的区别是，它采用双向绑定（data-binding）：View 的变动，自动反映在 ViewModel，反之亦然。

86. 常见的实现 MVVM 几种方式

参考答案：

1.发布-订阅者模式(backbone.js) 最早的mvvm框架

一般通过pub、sub的方式来实现数据和视图的绑定 使用起来比较麻烦

2.脏值检查(angular.js)

用定时器轮训检测数据是否发生改变 性能低

3.(vue用什么方式实现的数据绑定?)

数据劫持 Object.defineProperty给对象的属性增加修饰符来劫持各个属性的setter getter(获取值和设置值的时候 你都能知道

然后就可以修改页面的视图了) 此外还结合了发布订阅模式 把所有订阅 指定 统一做更新的处理

IE8以下不支持 Object.defineProperty这个属性的 所以vue只兼容到ie9

87. 解释下 Object. defineProperty()方法

参考答案：

这是 js 中一个非常重要的方法，ES6 中某些方法的实现依赖于它，VUE 通过它实现双向绑定，此方法会直接在一个对象上定义一个新属性，或者修改一个已经存在的属性， 并返回这个对象

解析：

语法

---

Object. defineProperty(object, attribute, descriptor)

• 这三个参数都是必输项

• 第一个参数为 目标对象

• 第二个参数为 需要定义的属性或者方法

• 第三个参数为 目标属性所拥有的特性

descriptor

---

前两个参数都很明确，重点是第三个参数 descriptor， 它有以下取值

• value: 属性的值

• writable: 属性的值是否可被重写（默认为 false）

• configurable: 总开关，是否可配置，若为 false, 则其他都为 false（默认为 false）

• enumerable: 属性是否可被枚举（默认为 false）

• get: 获取该属性的值时调用

• set: 重写该属性的值时调用

一个例子

var a = {};

Object.defineProperty(a, “b”, {

value: 123

});

console.log(a.b); //123

a.b = 456;

console.log(a.b); //123

a.c = 110;

for (item in a) {

console.log(item, a[item]); //c 110

}

因为 writable 和 enumerable 默认值为 false, 所以对 a. b 赋值无效，也无法遍历它

configurable

---

总开关，是否可配置，设置为 false 后，就不能再设置了，否则报错， 例子

var a = {};

Object.defineProperty(a, “b”, {

configurable: false

});

Object.defineProperty(a, “b”, {

configurable: true

});

//error: Uncaught TypeError: Cannot redefine property: b

writable

---

是否可重写

var a = {};

Object.defineProperty(a, “b”, {

value: 123,

writable: false

});

console.log(a.b); // 打印 123

a.b = 25; // 没有错误抛出（在严格模式下会抛出，即使之前已经有相同的值）

console.log(a.b); // 打印 123， 赋值不起作用。

enumerable

---

属性特性 enumerable 定义了对象的属性是否可以在 for… in 循环和 Object. keys() 中被枚举

var a = {};

Object.defineProperty(a, “b”, {

value: 3445,

enumerable: true

});

console.log(Object.keys(a)); // 打印[“b”]

enumerable 改为 false

var a = {};

Object.defineProperty(a, “b”, {

value: 3445,

enumerable: false //注意咯这里改了

});

console.log(Object.keys(a)); // 打印[]

set 和 get

---

如果设置了 set 或 get, 就不能设置 writable 和 value 中的任何一个，否则报错

var a = {};

Object.defineProperty(a, “abc”, {

value: 123,

get: function() {

return value;

}

});

//Uncaught TypeError: Invalid property descriptor. Cannot both specify accessors and a value or writable attribute, # at Function.defineProperty

对目标对象的目标属性 赋值和取值 时， 分别触发 set 和 get 方法

var a = {};

var b = 1;

Object.defineProperty(a, “b”, {

set: function(newValue) {

b = 99;

console.log(“你要赋值给我,我的新值是” + newValue);

},

get: function() {

console.log(“你取我的值”);

最后

面试题千万不要死记，一定要自己理解，用自己的方式表达出来，在这里预祝各位成功拿下自己心仪的offer。

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以添加V获取：vip1024c （备注前端）

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！
y-1713045173324)]

[外链图片转存中…(img-w7Gqo56g-1713045173324)]

[外链图片转存中…(img-yiDk7yaV-1713045173324)]

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以添加V获取：vip1024c （备注前端）
[外链图片转存中…(img-5c3Bpoxg-1713045173324)]

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！