Proxy、Reflect和WeakMap是ES6中引入的三个新的JavaScript特性。
Proxy
Proxy对象用于定义基本操作的自定义行为(例如属性查找、赋值、枚举、函数调用等)。
const handler = { get(target, prop, receiver) { console.log(`GET ${prop}`); return Reflect.get(target, prop, receiver); }, set(target, prop, value, receiver) { console.log(`SET ${prop} = ${value}`); return Reflect.set(target, prop, value, receiver); } }; const target = { foo: 'bar' }; const proxy = new Proxy(target, handler); proxy.foo; // 控制台输出: GET foo proxy.foo = 'baz'; // 控制台输出: SET foo = baz
在上面的例子中,
Reflect
const obj = { foo: 1, bar: 2, get baz() { return this.foo + this.bar; } }; console.log(Reflect.get(obj, 'foo')); // 1 console.log(Reflect.set(obj, 'foo', 3)); // true console.log(obj.foo); // 3
在上面的例子中,
WeakMap
const weakMap = new WeakMap(); const obj1 = {}; const obj2 = {}; weakMap.set(obj1, 'hello'); weakMap.set(obj2, 'world'); console.log(weakMap.get(obj1)); // 'hello' console.log(weakMap.get(obj2)); // 'world' // 当obj1和obj2被清除后,weakMap中的条目也会自动被清除 obj1 = null; obj2 = null;
在上面的例子中,
这三个特性结合起来,可以用于实现私有变量、函数柯里化、数据绑定等高级功能。例如,结合
const privateData = new WeakMap(); class Person { constructor(name, age) { privateData.set(this, { name, age }); } get name() { return privateData.get(this).name; } get age() { return privateData.get(this).age; } } const person = new Person('Alice', 25); console.log(person.name); // 'Alice' console.log(person.age); // 25
在这个例子中,