ES6 Proxy apply的疑问

Question

var twice = {
    apply (target, ctx, args) {
        return Reflect.apply(...arguments) * 2;
    }
};
function sum (left, right) {
    return left + right;
};

var proxy = new Proxy(sum, twice);
console.log(proxy(1, 2))

apply方法拦截函数的调用、call和apply操作。
想了蛮久，始终没懂执行流程。

Answer 1

拦截器中的Reflect.apply应该相当于调用sum.bind(ctx)。ctx是调用时的上下文对象，这里是undefined
这样你调用proxy(1,2)的返回值就相当于，Reflect.apply(...arguments)*2，也就是sum.bind(undefined)(1,2)。

阮大大有写到：

Proxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。
Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。

我个人理解是，本来你能直接达到目标(直接调用sum)，而现在你想访问对象会经过一个拦截层，你可以在调用前修改参数，也可以在调用后修改返回值（比如本例的*2)。
拦截器类似元编程，相当于修改语言特性的语法，比如本例就是对函数的apply机制进行修改，其他代理如get、set等相当于对对象的读写特性进行了修改，表面上看就好像语言特性被修改了。
看下这两个例子应该就能明白如何用Proxy来代理一个函数：

function sum(left, right) {
  return (this.x || left) + right;
}
var twice = {
  apply(target, ctx, args) {
    console.log(ctx == obj);
    return Reflect.apply(...arguments) * 2;
  },
};

var proxy = new Proxy(sum, twice);
let obj = { test: "test", proxy, x: 33 };
console.log(obj.proxy(1, 2));
//true
//70
//可见ctx为执行环境this

var twice_changeParams = {
  apply(target, ctx, args) {
    args[1] = args[1] + 5;
    return Reflect.apply(...arguments) * 2;
  },
};
proxy = new Proxy(sum, twice_changeParams);
console.log(proxy(1, 2));
// 16
//16为sum(1,(2+5))*2 分别对输入和输出进行了拦截
//这就是拦截器的含义