面试题搜集

1. vue3 使用proxy解决了什么问题？

vue3.0 尝鲜 -- 摒弃 Object.defineProperty，基于 Proxy 的观察者机制探索
面试官: 实现双向绑定Proxy比defineproperty优劣如何?
使用新特性实现一个简单的MVVM(2)--深入数据响应

proxy并不能深度代理属性，也就是深层次属性赋值，并不能触发set函数，看阮大神的回复

阮一峰的回复

ECMAScript 6 入门

也可以从另一方面理解，【面试篇】寒冬求职季之你必须要懂的原生JS(中) 我们可以看到 Proxy 会劫持整个对象，读取对象中的属性或者是修改属性值，那么就会被劫持。但是有点需要注意，复杂数据类型，监控的是引用地址，而不是值，如果引用地址没有改变，那么不会触发set。

let obj = {name: 'Yvette', hobbits: ['travel', 'reading'], info: {
    age: 20,
    job: 'engineer'
}};
let p = new Proxy(obj, {
    get(target, key) { //第三个参数是 proxy， 一般不使用
        console.log('读取成功');
        return Reflect.get(target, key);
    },
    set(target, key, value) {
        if(key === 'length') return true; //如果是数组长度的变化，返回。
        console.log('设置成功');
        return Reflect.set([target, key, value]);
    }
});
p.name = 20; //设置成功
p.age = 20; //设置成功; 不需要事先定义此属性
p.hobbits.push('photography'); //读取成功;注意不会触发设置成功
p.info.age = 18; //读取成功;不会触发设置成功

对于深层次引用类型的数据需要层层代理，这样才能其对应的set函数，proxy是代理在对象级别的，不需要为每个属性设置代理，而Object.defineProperty 是需要遍历对象的每个属性设置代理