共计 886 个字符，预计需要花费 3 分钟才能阅读完成。
问题
前一段时间在字节跳动时聊到了 Proxy。起因是问道 Vue 中数据绑定的实现，回答通过设置 setter 和 getter 实现，问这样有什么缺点，答在对对象的属性的监控方面存在瑕疵，例如通过直接设置数组下标进行赋值，或者对对象直接进行修改，是无法观察到的，必须使用 Vue.set 添加，或者使用 Array.prototype.push 等方法。面试官介绍说在 Vue3 中已经通过 Proxy 解决了这个问题。Proxy 是 ES6 中添加的内置对象，和 Reflect 配合功能十分强大。正好今天看到一个问题。
理解
根据 MDN 的文档，Proxy 是对原对象的包装。可以包装的内容包括一系列 get、set 等，值得注意的是 getPrototypeOf 同样是一种可以拦截的操作。同时，对于未定义的操作保持原结果。在 instanceof 的页面，可以看到如下示例
function C() {}
function D() {}
var o = new C();
// true, because: Object.getPrototypeOf(o) === C.prototype
o instanceof C;
那么，在上面那个问题中，既然未定义 proxy 的 getPrototypeOf，那它就该与原对象保持一致。使用以下代码进行验证：
Object.getPrototypeOf(proxy) === Array.prototype //true
进一步思考
那么，是不是对于一切行为，在不做任何拦截的情况下，就能保证与目标对象的行为完全一致呢？很显然，这是不可能的。例如
a = {}
b = new Proxy(a, {})
console.log(a === b) //false
以及 this 的指向问题（案例来自阮一峰文章）
const target = {
m: function () {
console.log(this === proxy);
}
};
const handler = {};
const proxy = new Proxy(target, handler);
target.m() // false
proxy.m() // true
虽然大部分情况下这应该不会成为大的障碍，但遇到错误的时候可以从这里入手寻找问题。
