6. 代理与反射

最新推荐文章于 2024-08-11 18:40:36 发布

Spider小郭

最新推荐文章于 2024-08-11 18:40:36 发布

阅读量365

点赞数 5

分类专栏： JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/m0_69843492/article/details/140723312

版权

JavaScript 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

代理基础

代理是目标对象的抽象
它可以用作目标对象的替身，但又完全独立于目标对象
目标对象既可以直接被操作，也可以通过代理来操作。但直接操作会绕过代理施予的行为

创建空代理

最简单的代理就是空代理，即除了作为一个抽象的目标对象，什么也不做
默认情况下，在代理对象上执行的所有操作都会无障碍地传播到目标对象。
在任何可以使用目标对象地地方，都可以通过同样的方式来使用与之关联的代理对象

代理是使用 Proxy 构造函数创建的
这个构造函数接收两个参数:
  - 目标对象
  - 处理程序对象
（缺少任何一个参数，都会抛出 TypeError）

// 创建空代理,可以传一个简单的对象字面量作为处理程序，从而让所有操作畅通无阻地抵达目标对象

// 在代理对象上执行的任何操作实际上都会应用到目标对象
// 唯一不可感知的不同就是代码中操作的是代理对象

const target = {
    id: "target"
};

const handler = {};
const proxy = new Proxy(target, handler);

// id 属性会访问同一个值
console.log('target.id:  ', target.id);
console.log('proxy.id:  ', proxy.id);
console.log('==================')

// 给目标属性赋值会反应在两个对象上
// 因为两个对象访问的是同一个值
target.id = "foo";
console.log('target.id:  ', target.id);
console.log('proxy.id:  ', proxy.id);
console.log('==================')

// hasOwnProperty() 方法在两个地方
// 都会应用到目标对象
console.log('target.hasOwnProperty("id"):  ', target.hasOwnProperty("id"));
console.log('proxy.hasOwnProperty("id"):  ', proxy.hasOwnProperty("id"));
console.log('==================')

// 严格相等可以用来区分代理和目标
console.log('target === proxy:  ', target === proxy);


// Proxy.prototype 是 undefined
console.log(target instanceof Proxy);
console.log(proxy instanceof Proxy);

定义捕获器

使用代理目标目的是可以定义捕获器

get() 捕获器

在 ECMAScript 操作一某种形式调用 get() 时触发。

const target = {
    foo: 'bar'
}

const handler = {
    // 捕获器在处理程序对象中一方法名为键
    get() {
        return 'handler override';
    }
}

const proxy = new Proxy(target, handler);

这个操作在 JS 代码中可以通过多种形式触发并被 get() 捕获器拦截到
proxy[property], proxy.property, Object.create(proxy)[property] 等操作都会触发基本的 get() 操作以获取属性

只有在代理对象上执行这些操作才会触发捕获器。
在目标对象上执行这些操作仍然会产生正常的行为

const target = {
    foo: 'bar'
}

const handler = {
    // 捕获器在处理程序对象中以方法名为键
    get(){
        return "handler override"
    }
}

const proxy = new Proxy(target, handler);

console.log(target.foo);
console.log(proxy.foo)
console.log('====================')


console.log(target['foo'])
console.log(proxy['foo'])
console.log('====================')


console.log(Object.create(target)['foo'])
console.log(Object.create(proxy)['foo'])
console.log('====================')

捕获器参数和反射 API

所有捕获器都可以访问相应的参数，基于这些参数可以重建被捕获方法的原始行为

get() 捕获器会接收到目标对象，要查询的属性和代理对象三个参数

const target = {
    foo: 'bar'
}

const handler = {
    // 捕获器在处理程序对象中以方法名为键
    get(tarpTarget, property, receiver){
        console.log(tarpTarget === target);
        console.log(property);
        console.log(receiver === proxy);
    }
}

const proxy = new Proxy(target, handler);
proxy.foo;
console.log('====================');

有了这些参数，就可以重建被捕获方法的原始行为

const target = {
    foo: 'bar'
}

const handler = {
    get(tarpTarget, property, receiver){
        return tarpTarget[property]
    }
}

const proxy = new Proxy(target, handler);
console.log(proxy.foo);
console.log(target.foo);

有了这些参数，就可以重建被捕获方法的原始行为

const target = {
    foo: 'bar'
}

const handler = {
    get(){
        return Reflect.get(...arguments);
    }
}

const proxy = new Proxy(target, handler);

console.log(proxy.foo);
console.log(target.foo);

甚至还可以写得更简洁一点

const target = {
    foo: 'bar'
}

const handler = {
    get: Reflect.get
}

const proxy = new Proxy(target, handler);

console.log(proxy.foo);
console.log(target.foo);

如果想创建一个可以捕获所有方法，然后将每个方法转发给对应反射 API 的空代理（甚至不需要定义处理程序对象）

const target = {
    foo: 'bar'
}

const proxy = new Proxy(target, Reflect);

console.log(proxy.foo);
console.log(target.foo);

反射 API 为开发者准备好了样板代码，在此基础上可以用最少的代码修改捕获的方法

const target = {
    foo: 'bar',
    baz: 'qux'
}

const handler = {
    get(tarpTarget, property, receiver){
        let decoration = '';
        if(property === 'foo'){
            decoration = '!!!';
        }
        return Reflect.get(...arguments) + decoration;
    }
}

const proxy = new Proxy(target, handler);


console.log(proxy.foo);
console.log(target.foo);


console.log(proxy.baz);
console.log(target.baz);

捕获器不变式

捕获器不变式因方法不同而异，但通常都会防止捕获器定义出现过于反常的行为

例如：目标对象有一个不可配置且不可写的数据属性，那么在捕获器返回一个与该属性不同的值时，会抛出 TypeError

const target = {
    foo: 'bar',
    baz: 'qux'
}

Object.defineProperty(target, 'foo', {
    configurable: false,
    writable: false,
    value: 'bar'
})

const handler = {
    get (){
        return 'qux';
    }
}

const proxy = new Proxy(target, handler);
console.log(proxy.baz);
console.log(proxy.foo);
// TypeError

可撤销代理

有时候可能需要终端代理对象与目标对象之间的联系
Proxy 暴露了 revocable() 方法，这个方法支持撤销代理对象与目标对象的关联
撤销代理的操作是不可逆。
撤销函数（revoke()）是幂等的，调用多少次的结果都一样。
撤销代理之后再调用代理会抛出 TypeError

// 撤销函数和代理对象是在实例化时同时生成的
const target = {
    foo: 'bar'
}

const handler = {
    get(){
        return 'intercepted';
    }
}

const {proxy, revoke} = Proxy.revocable(target, handler);

console.log(proxy.foo);
console.log(target.foo);

revoke();  // 撤销代理函数

console.log(proxy.foo);

使用反射 API

某些情况下，应该优先使用 API
1. 反射 API 与 对象 API
  - 在使用反射 API 时，要记住：
     - 1. 反射 API 并不限于捕获处理程序;
     - 2. 大多数反射 API 方法在 Object 类型上有对应的方法

通常，Object 上的方法适用于通用程序，而反射方法使用细粒度的对象控制与操作。

状态标记

 状态标记
  - 很多反射方法返回称作 ”状态标记“ 的布尔值，表示意图执行的操作是否成功
  - 状态标记比那些返回修改后的对象或者抛出错误(取决于方法)的反射 API 方法更有用

可以使用反射 API 对下面的代码进行重构

// 初始代码
const o = {};

try{
    Object.defineProperty(o, 'foo', 'bar');
    console.log('success');
} catch(e){
    console.log('failure');
}

定义新属性时如果发生问题，Reflect.defineProperty() 会返回 False

// 初始代码
const o = {};

if(Reflect.defineProperty(o, 'foo', {value: 'bar'})){
    console.log('sucess');
}else{
    console.log('failure');
}

一下反射方法都会提供状态标记
Reflect.defineProperty()
Reflect.preventExtensions()
Reflect.setPrototypeOf()
Reflect.set()
Reflect.deleteProperty()

用一等函数替代操作符

以下反射方法提供只有通过操作符才能完成的操作
  - Reflect.get(): 可以替代对象属性访问操作符
  - Reflect.set(): 可以替代 = 赋值操作符
  - Reflect.has(): 可以替代 in 操作符或 with()
  - Reflect.deleteProperty(): 可以替代 delete 操作符
  - Reflect.construct(): 可以替代 new 操作符

安全地应用函数

通过 apply 方法调用函数时，被调用的函数可能也定义了自己的 apply 属性（虽然可能性极小）
为绕过这个问题，可以使用定义在  Function 原型上的 apply 方法

Function.prototype.apply(myFunc, thisVal, argumentList);
这种可怕的代码完全可以使用 Reflect.apply() 来避免
Reflect.apply(myFunc, thisVal, argumentsList);

代理另一个代理

代理可以拦截反射 API 的操作，而这意味着完全可以创建一个代理，通过它去去代理另一个代理

const target = {
    foo: 'bar'
}

const first_Proxy = new Proxy(target, {
    get(){
        console.log('first proxy');
        return Reflect.get(...arguments)
    }
});

const secondProxy = new Proxy(first_Proxy, {
    get(){
        console.log('second proxy');
        return Reflect.get(...arguments);
    }
})

console.log(secondProxy.foo);

代理的问题与不足

某些情况下，代理也不能与现在的 ECMAScript 机制很好地协同

代理中的 this

方法中的 this 通常指向调用这个方法的对象

const target = {
    thisValEqualsProxy(){
        return this === proxy;
    }
}

const proxy = new Proxy(target, {});


console.log(target.thisValEqualsProxy());
console.log(proxy.thisValEqualsProxy());

如果目标对象依赖于对象标识，那就可能碰到意料之外的问题

const wm = new WeakMap();

class User{
    constructor(userId){
        wm.set(this, userId);
    }

    set id(userId){
        wm.set(userId);
    }

    get id(){
        return wm.get(this);
    }
}

// 由于这个实现依赖 User 实例的对象标识，在这个实例被代理的情况下就会出现问题:
const user = new User(123);
console.log(user.id);  // 123

const usetInstanceProxy = new Proxy(user, {});
console.log(usetInstanceProxy.id)  // undefined

要解决这个问题，需要重新配置代理，把代理 User 实例改为代理 User 类本身
之后再创建代理的实例就会以代理实例作为 WeakMap 的键了

const wm = new WeakMap();

class User{
    constructor(userId){
        wm.set(this, userId);
    }

    set id(userId){
        wm.set(userId);
    }

    get id(){
        return wm.get(this);
    }
}

// 由于这个实现依赖 User 实例的对象标识，在这个实例被代理的情况下就会出现问题:
const user = new User(123);
console.log(user.id);  // 123

const UserClassProxy = new Proxy(User, {});
const proxyUser = new UserClassProxy(456);
console.log(proxyUser.id);

代理与内部槽位

代理与内置引用类型地实例，通常可以很好地协同
但有些内置类型可能会依赖代理无法控制的机制，结果导致在代理上调用某些方法会出错

const target = new Date();
const proxy = new Proxy(target, {});

console.log(proxy instanceof Date);
proxy.getDate();  // Uncaught TypeError TypeError: this is not a Date object.

代理捕获器与反射方法

代理可以捕获 13种不同的基本操作（这些操作有各自不同的反射 API 方法，参数，关联 ECMAScript 操作和不变式
对于在代理对象上执行的任何一种操作，只会有一个捕获处理程序被调用。不会存在重复捕获的情况
只要在代理上调用，所有捕获器都会拦截它们对应的反射 API 操作

get()

get() 捕获器会在获取属性值的操作中被调用。对应的反射 API 方法为 Reflect.get()

const myTarget = {};
const proxy = new Proxy(myTarget, {
    get(target, property, receiver){
        console.log('get()');
        return Reflect.get(...arguments)
    }
})

proxy.foo

返回值

返回值无限制

拦截的操作

> proxy.property
> proxy[property]
> Object.create(proxy)[property]
> Reflect.get(proxy, propertym receiver)

捕获器处理程序参数

target: 目标对象
property: 引用的目标对象上的字符串键属性
receiver: 代理对象或继承代理对象的对象

捕获器不变式

如果 target.property 不可写且不可配置，则处理程序返回的值必须与 target.property 匹配
如果 target,property 不可配置且 [Get] 特性为 undefined，处理程序的返回值也必须是 undefined

set()

set() 捕获器会在设置属性值的操作中被调用
对应的反射 APi 方法为 Reflect.set()

const myTarget = {};

const proxy = new Proxy(myTarget, {
    set(target, property, value, receiver){
        console.log('set()');
        Reflect.set(...arguments);
    }
})

proxy.foo = 'bar';

返回值

返回true代表成功，返回 false 表示失败，严格模式下会抛出 TypeError
property 参数除了字符串键，也能能是符号(Symbol)键

拦截的操作

proxy.property = value
proxy[property] = value
Object.create(proxy)[property] = value
Reflect.set(proxy, property, value, receiver)

捕获器处理程序参数

target: 目标对象
property: 引用的目标对象上的字符串键属性
value: 要赋给属性的值
receiver: 接收最初赋值的对象

捕获器不变式

如果 target.property 不可写且不可配置，则不能修改目标属性的值
如果 target.property 不可配置且 [Set] 特性为 undefined, 则不能修改目标属性的值
严格模式下，处理程序中返回 false 会抛出 TypeError

has()

has() 捕获器会在 in 操作符中被调用
对应的反射 API 为 Reflect.has()

const myTarget = {};
const proxy = new Proxy(myTarget, {
    has(target, property){
        console.log('has()');
        Reflect.has(...arguments)
    }
});

'foo' in proxy;

返回值

has() 必须返回布尔值，表示属性是否存在。返回非布尔值会被转型为布尔值

拦截的操作

property in proxy
property in Object.create(property)
with(proxy) { (property);}
Reflect.has(proxy, property)

捕获器处理程序参数

target: 目标对象
property: 引用的目标对象上得到字符串键属性

捕获器不变式

如果 target.property 存在且不可配置，则处理程序必须返回 true
如果 target.property 存在且目标对象不可扩展，则处理程序必须返回 true

defineProperty()

defineProperty() 捕获器会在 Object.defineProperty() 中被调用
对应的反射 API 方法为 Reflect.defineProperty()

const myTarget = {};
const proxy = new Proxy(myTarget, {
    defineProperty(target, property, descriptor){
        console.log('defineProperty');
        console.log('target ', target);
        console.log('property ', property);
        console.log('descriptor ', descriptor);
        return Reflect.defineProperty(...arguments);
    }
})

Object.defineProperty(proxy, 'foo', {value: 'bar'});
// defineProperty

返回值

defineProperty() 必须返回布尔值，表示属性是否成功定义，返回非布尔值会被转型成布尔值

拦截的操作

Object.defineProperty(proxy, property, descriptor)
Reflect.defineProperty(proxy, property, descripto)

捕获器处理程序参数

target: 目标对象
property: 引用的目标对象上的字符串键属性
descriptor: 包含可选的 enumerable, configurable, writable, value, get 和 set 定义的对象

捕获器不变式

如果目标对象不可扩展，则无法定义属性
如果目标对象有一个可配置的属性，则不能添加同名的不可配置属性
如果目标对象有一个不可配置的属性，则不能添加同名的可配置属性

getOwnPropertyDescriptor()

getOwnPropertyDescriptor() 捕获器会在 Object.getOwnPropertyDescriptor() 中被调用
对应的反射 API 方法为 Reflect.getOwnPropertyDescriptor()

const myTarget = {};
const proxy = new Proxy(myTarget, {
    getOwnPropertyDescriptor(target, property){
        console.log('getOwnPropertyDescriptor()');
        return Reflect.getOwnPropertyDescriptor(...arguments)
    }
})

Object.getOwnPropertyDescriptor(proxy, 'foo')

返回值

getOwnPropertyDescriptor() 必须返回对象，或者在属性不存在时返回 undefined

拦截的操作

Object.getOwnPropertyDescriptor(proxy, property)
Reflect.getOwnPropertyDescriptor(proxy, property)

捕获器处理程序参数

target: 目标对象
property: 引用的目标对象上的字符串键属性

捕获器不变式

如果自有的 target.property 存在且不可配置，则处理程序必须返回一个表示该属性存在的对象
如果自有的 target.property 存在且可配置，则处理程序必须返回表示该属性可配置的对象
如果自有的 target.property 存在且 target 不可扩展，则处理程序必须返回一个表示该属性存在的对象
如果 target.property 不存在且 target 不可扩展，则处理程序必须返回 undefined 表示该属性不存在
如果 target.property 不存在，则处理程序不能返回表示该属性可配置的对象

deleteProperty()

deleteProperty() 捕获器会在 delete 操作符中被调用。
对应的反射 API 方法为 Reflect.deleteProperty()

const myTarget = {};
const proxy = new Proxy(myTarget, {
    deleteProperty(target, property){
        console.log('deleteProperty()');
        return Reflect.deleteProperty(...arguments)
    }
})

delete proxy.foo;

返回值

deleteProperty() 必须返回布尔值，表示删除属性是否成功。返回非布尔值会被转型为布尔值

拦截的操作

delete proxy.property
delete proxy[property]
Reflect.deleteProperty(proxy, property)

捕获器处理程序参数

target: 目标对象
property: 引用目标对象上的字符串键属性

捕获器不变式

如果自有的 target.property 存在且不可配置，则处理程序不能删除这个属性

ownKeys()

ownKeys() 捕获器会在 Object.keys() 及类似方法中被调用。
对应的反射 APi 方法为 Reflect.ownKeys()

const myTarget = {};
const proxy = new Proxy(myTarget, {
    ownKeys(target){
        console.log('ownKeys');
        return Reflect.ownKeys(...arguments);
    }
})

Object.keys(proxy);

返回值

ownKeys() 必须返回包含字符串或符号的可枚举对象

拦截的操作

Object.getOwnPropertyNames(proxy)
Object.getOwnPropertySymbols(proxy)
Object.keys(proxy)
Object.ownKeys(proxy)

捕获器处理程序参数

target: 目标对象

捕获器不变式

返回的可枚举对象必须包含 target 的所有不可配置的自有属性
如果 target 不可扩展，则返回可枚举对象必须准确地包含自有属性键

getPrototypeOf()

getPrototypeOf() 捕获器会在 Object.getPrototypeOf() 中被调用
对应的反射 API 方法为 Reflect.getPrototypeOf()

const myTarget = {};

const proxy = new Proxy(myTarget, {
    getPrototypeOf(target){
        console.log('getPrototypeOf()');
        return Reflect.getPrototypeOf(...arguments)
    }
})

Object.getPrototypeOf(proxy);

返回值

getPrototypeof() 必须返回对象或 null

拦截的操作

Object.getPrototypeOf(proxy)
Reflect.getPrototypeOf(proxy)
proxy.__proto__
Object.prototype.isPrototypeOf(proxy)
proxy instanceof Object

捕获器处理程序参数

target: 目标对象

捕获器不变式

如果 target 不可扩展，则 Object.getPrototypeOf(proxy) 
唯一有效的返回值就是 getPrototypeOf(target) 的返回值

setPrototypeOf()

setPrototypeOf() 捕获器会在 Object.setPrototypeOf() 中被调用
对应的反射 API 方法为 Reflect.setPrototypeOf()

const myTarget = {};
const proxy = new Proxy(myTarget, {
    setPrototypeOf(target, prototype){
        console.log('setPrototypeOf()');
        return Reflect.setPrototypeOf(...arguments);
    }
})

Object.setPrototypeOf(proxy, Object);

返回值

setPrototypeOf() 必须返回布尔值，表示原型赋值是否成功。
返回非布尔值会被转型为布尔值·

拦截的操作

Object.setPrototypeOf(proxy)
Reflect.serPrototypeOf(proxy)

捕获器处理程序参数

target: 目标对象
prototype: target 的替代原型，如果是定义原型则为  null

捕获器不变式

如果 target 不可扩展，则位移有效的 prototype 参数就是 Object.getPrototypeof(target) 的返回值

isExctensible()

isExctensible() 捕获器会在 Object.isExtensible() 中被调用
对应的反射 API 方法为 Reflect.isExtensible()

const myTarget = {};

const proxy = new Proxy(myTarget, {
    isExtensible(target){
        console.log('isExtensible');
        return Reflect.isExtensible(...arguments);
    }
})

Object.isExtensible(proxy);

返回值

isExtensible() 必须返回布尔值，表示 target 是否可扩展，返回非布尔值会被转型为布尔值。

拦截的操作

Object.isExtensible(proxy)
Reflect.isExtensible(proxy)

捕获器处理程序参数

target: 目标对象

捕获器不变式

如果 target 可扩展，则处理程序必须返回 true
如果 target 不可扩展，则处理程序必须返回 false

preventExtensions()

preventExtensions() 捕获器会在  Object.preventExtensions() 中被调用
对应的反射 API 方法为 Reflect.preventExtensions()

const myTarget = {};

const proxy = new Proxy(myTarget, {
    preventExtensions(target){
        console.log('preventExtensions()')
        return Reflect.preventExtensions(...arguments)
    }
})
Object.preventExtensions(proxy);

返回值

preventExtensions() 必须返回布尔值， 表示 target 是否已经不可扩展
返回非布尔值会被转型为布尔值

拦截的操作

Object.preventExtensions(proxy)
Reflect.preventExtensions(proxy)

捕获器处理程序参数

target: 目标对象

捕获器不变式

如果 Object.isExtensible(proxy) 是 false, 则处理程序必须返回 true

apply()

apply() 捕获器会在调用函数时被调用
对应的反射 API 方法为 Reflect.apply()

const myTarget = () => {};

const proxy = new Proxy(myTarget, {
    apply(target, thisArg, ...argumentsList){
        console.log('apply()');
        return Reflect.apply(...arguments);
    }
})

proxy();

返回值

返回值无限制

拦截的操作

proxy(...argumentsList)
Function.prototype.apply(thisArg, argumentsList)
Function.prototype,call(thisArg, ...argumentsList)
Reflect.apply(target, thisArgument, argumentsList)

捕获处理程序参数

target: 目标对象
thisArg: 调用函数时的 this 参数
argumentsList: 调用函数时的参数列表

捕获器不变式

target 必须是一个函数对象

construct()

construct() 捕获器会在 new 操作符中被调用
对应的反射 API 方法为 Reflect.construct()

const myTarget = function() {};

const proxy = new Proxy(myTarget, {
    construct(target) {
        console.log('construct()');
        return Reflect.construct(...arguments)
    }
})

new proxy();

返回值

constructor() 必须返回一个对象

拦截的操作

new Proxy(...argumentsList)
Reflect.construct(target, argumentList, newTarget)

捕获器处理程序参数

target: 目标构造函数
argumentsList:  传给目标构造函数的参数列表
newTarget: 最初被调用的构造函数

代理模式

跟踪属性访问

通过捕获 get, set, has 等操作
  - 可以知道对象属性什么时候被访问，被查询
  - 把实现相应捕获器的某个对象代理放到应用中，可以监控这个对象何时被访问过

const user = {
    name: 'Jake'
}

const proxy = new Proxy(user, {
    get(target, property, receiver){
        console.log(`Getting ${property}`)
        return Reflect.get(...arguments)
    },
    
    set(target, property, value, receiver){
        console.log(`Setting ${property}=${value}`);
        return Reflect.set(...arguments);
    }
})

proxy.name;
proxy.age = 27;

隐藏属性

代理的内部实现对外部代码是不可见的，因此要隐藏目标对象上的属性页轻而易举

const hiddenProperties = ['foo', 'bar'];
const targetObject = {
	foo: 1,
    bar: 2,
    baz: 3
}
const proxy = new Proxy(targetObject, {
    get(target, property){
        if (hiddenProperties.includes(property)){
            return undefined;
        }else{
            return Reflect.get(...arguments);
        }
    },
    has(target, property){
        if(hiddenProperties.includes(property)){
            return false;
        }else{
            return Reflect.get(...arguments);
        }
    }
})

// get()
console.log(proxy.foo);
console.log(proxy.bar);
console.log(proxy.baz);


// set()
console.log('foo' in proxy);
console.log('bar' in proxy);
console.log('baz' in proxy);

属性验证

所有赋值操作都会触发 set() 捕获器，可以根据所赋的值决定是允许还是拒绝赋值

const target = {
    onlyNumbersGoHere: 0
}

const proxy = new Proxy(target, {
    set(target, property, value){
        if(typeof value !== 'number'){
            return false
        }else{
            return Reflect.set(...arguments);
        }
    }
})


proxy.onlyNumbersGoHere = 1;
console.log(proxy.onlyNumbersGoHere);
proxy.onlyNumbersGoHere = '2';
console.log(proxy.onlyNumbersGoHere);

函数与构造函数参数验证

跟保护和验证对象属性类似，也可对函数和构造函数参数进行审查
（可以让函数只接收某种类型的值）

function median(...nums){
    return nums.sort()[Math.floor(nums.length / 2)];
}


const proxy = new Proxy(median, {
    apply(target, thisArg, argumentsList){
        for (const arg of argumentsList){
            if(typeof arg !== 'number'){
                throw 'Non-number argument provided';
            }
        }
        return Reflect.apply(...arguments);
    }
})

console.log(proxy(4, 7, 1));
console.log(proxy(4, '7', 1));

类似地，可以要求实例化时必须给构造函数传参

class User {
    constructor(id){
        this.id_ = id;
    }
}

const proxy = new Proxy(User, {
    construct(target, argumentList, newTarget){
        if(argumentList[0] == undefined){
            throw 'User cannot be instantiated withour id';
        } else {
            return Reflect.construct(...arguments);
        }
    }
});

new proxy(1);
new Proxy();

数据绑定与可观察对象

通过代理可以把运行时中原本不相关的部分联系在一起
这样就可以实现各种模式，从而让不同的代码互操作
可以将被代理的类绑定到一个全局实例集合，让所有创建的实例都被添加到这个集合中

const userList = [];

class User {
    constructor(name){
        this.name_ = name;
    }
}

const proxy = new Proxy(User, {
    construct() {
        const newUser = Reflect.construct(...arguments);
        userList.push(newUser);
        return newUser;
    }
})

new proxy('John');
new proxy('Jacob');
new proxy('Jingleheimerschmidt');
console.log(userList);

另外，还可以把集合绑定到一个时间分派程序，每次插入新实例都会发送消息

const userList = [];

function emit(newValue){
    console.log(newValue);
}

const proxy = new Proxy(userList, {
    set(target, property, value, receiver){
        const result = Reflect.set(...arguments);
        if (result) {
            emit(Reflect.get(target, property, receiver));
        }
        return result;
    }
})

proxy.push('John');
proxy.push('Jacob');