本文实例讲述了ES6 proxy和reflect的使用方法。分享给大家供大家参考，具体如下：proxy和reflect都是es6为了更好的操作对象而提供的新的API，接下来探讨一下二者的作用，联系。设计proxy，reflect的作用：proxy的作用：Proxy的设计目的在于（修改编程语言），修改某些操作方法的默认行为，Proxy的设计目的在于（修改编程语言），修改某些操作方法的默认行为，等同于在语言层面作出修改，是元编程（meta programming）
例如修改set，get方法等同于在语言层面作出修改，是元编程（meta programming）
reflect的作用：1，映射一些明显属于对象语言内部的方法，目前是共存于Object和Reflect上，未来只在Reflect上1，映射一些明显属于对象语言内部的方法，目前是共存于Object和Reflect上，未来只在Reflect上Object2，修改一些Object上的方法返回的结果，减少异常抛出，使其变得更加合理2，修改一些Object上的方法返回的结果，减少异常抛出，使其变得更加合理Object3，让Object操作都变成函数行为（主要的作用）3，让Object操作都变成函数行为（主要的作用）Object4，Reflect对象的方法与Proxy对象的方法一一对应（主要的作用）4，Reflect对象的方法与Proxy对象的方法一一对应（主要的作用）ReflectProxyproxy和reflect的方法：proxy和reflect的方法：proxy的实例方法：





get()

set()

apply()

has()

cunstruct()

deleteProperty()

defineProperty()





getOwnPropertyDescriptor()

getPrototypeOf()

isExtensible()

ownKeys(),

preventExtensions()

setPrototypeOf()










get()

set()

apply()

has()

cunstruct()

deleteProperty()

defineProperty()





getOwnPropertyDescriptor()

getPrototypeOf()

isExtensible()

ownKeys(),

preventExtensions()

setPrototypeOf()







get()

set()

apply()

has()

cunstruct()

deleteProperty()

defineProperty()

get()get()set()set()apply()apply()has()has()cunstruct()cunstruct()deleteProperty()deleteProperty()defineProperty()defineProperty()

getOwnPropertyDescriptor()

getPrototypeOf()

isExtensible()

ownKeys(),

preventExtensions()

setPrototypeOf()



getOwnPropertyDescriptor()getOwnPropertyDescriptor()getPrototypeOf()getPrototypeOf()isExtensible()isExtensible()ownKeys(),ownKeys(),preventExtensions()preventExtensions()setPrototypeOf()setPrototypeOf() 
var person = {
name: "张三"
};

var proxy = new Proxy(person, {
get: function(target, property) {

if (property in target) {

return target[property];

} else {

throw new ReferenceError("Property \"" + property + "\" does not exist.");

}
}
});

var person = {
name: "张三"
};

var proxy = new Proxy(person, {
get: function(target, property) {

if (property in target) {

return target[property];

} else {

throw new ReferenceError("Property \"" + property + "\" does not exist.");

}
}
});
注：目标对象内部的this关键字会指向 Proxy 代理目标对象内部的this关键字会指向 Proxy 代理this自身方法：Proxy.revocable方法返回一个可取消的 Proxy 实例自身方法：自身方法：Proxy.revocableProxy.revocable方法返回一个可取消的 Proxy 实例方法返回一个可取消的 Proxy 实例reflect的静态方法：reflect的静态方法：和proxy相对应，reflect有13个静态方法，分别一一对应于proxy的实例方法和proxy相对应，reflect有13个静态方法，分别一一对应于proxy的实例方法





Reflect.apply(target, thisArg, args)

Reflect.construct(target, args)





Reflect.get(target, name, receiver)

Reflect.set(target, name, value, receiver)





Reflect.defineProperty(target, name, desc)

Reflect.deleteProperty(target, name)





Reflect.has(target, name)

Reflect.ownKeys(target)





Reflect.isExtensible(target)

Reflect.preventExtensions(target)





Reflect.getOwnPropertyDescriptor(target, name)

Reflect.getPrototypeOf(target)





Reflect.setPrototypeOf(target, prototype)










Reflect.apply(target, thisArg, args)

Reflect.construct(target, args)





Reflect.get(target, name, receiver)

Reflect.set(target, name, value, receiver)





Reflect.defineProperty(target, name, desc)

Reflect.deleteProperty(target, name)





Reflect.has(target, name)

Reflect.ownKeys(target)





Reflect.isExtensible(target)

Reflect.preventExtensions(target)





Reflect.getOwnPropertyDescriptor(target, name)

Reflect.getPrototypeOf(target)





Reflect.setPrototypeOf(target, prototype)







Reflect.apply(target, thisArg, args)

Reflect.construct(target, args)

Reflect.apply(target, thisArg, args)Reflect.apply(target, thisArg, args)Reflect.construct(target, args)Reflect.construct(target, args)

Reflect.get(target, name, receiver)

Reflect.set(target, name, value, receiver)

Reflect.get(target, name, receiver)Reflect.get(target, name, receiver)Reflect.set(target, name, value, receiver)Reflect.set(target, name, value, receiver)

Reflect.defineProperty(target, name, desc)

Reflect.deleteProperty(target, name)

Reflect.defineProperty(target, name, desc)Reflect.defineProperty(target, name, desc)Reflect.deleteProperty(target, name)Reflect.deleteProperty(target, name)

Reflect.has(target, name)

Reflect.ownKeys(target)

Reflect.has(target, name)Reflect.has(target, name)Reflect.ownKeys(target)Reflect.ownKeys(target)

Reflect.isExtensible(target)

Reflect.preventExtensions(target)

Reflect.isExtensible(target)Reflect.isExtensible(target)Reflect.preventExtensions(target)Reflect.preventExtensions(target)

Reflect.getOwnPropertyDescriptor(target, name)

Reflect.getPrototypeOf(target)

Reflect.getOwnPropertyDescriptor(target, name)Reflect.getOwnPropertyDescriptor(target, name)Reflect.getPrototypeOf(target)Reflect.getPrototypeOf(target)

Reflect.setPrototypeOf(target, prototype)



Reflect.setPrototypeOf(target, prototype)Reflect.setPrototypeOf(target, prototype) proxy和reflect联系：proxy的实例方法和reflect的静态方法一一对应proxy和reflect联系：proxy的实例方法和reflect的静态方法一一对应实例：观察者模式的实现
const queuedObservers = new Set();

const observe = fn => queuedObservers.add(fn);//接收一个函数fn
const observable = obj => new Proxy(obj, {set});//接收一个对象obj，采用set函数拦截设置obj

function set(target, key, value, receiver) {
const result = Reflect.set(target, key, value, receiver);
queuedObservers.forEach(observer => observer());
return result;
}

const queuedObservers = new Set();

const observe = fn => queuedObservers.add(fn);//接收一个函数fn
const observable = obj => new Proxy(obj, {set});//接收一个对象obj，采用set函数拦截设置obj

function set(target, key, value, receiver) {
const result = Reflect.set(target, key, value, receiver);
queuedObservers.forEach(observer => observer());
return result;
}
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools./code/HtmlJsRun测试上述代码运行效果。在线HTML/CSS/JavaScript代码运行工具在线HTML/CSS/JavaScript代码运行工具http://tools./code/HtmlJsRun关于JavaScript相关内容可查看本站专题：《JavaScript操作DOM技巧总结》、《JavaScript页面元素操作技巧总结》、《JavaScript事件相关操作与技巧大全》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript错误与调试技巧总结》JavaScript操作DOM技巧总结JavaScript页面元素操作技巧总结JavaScript事件相关操作与技巧大全JavaScript查找算法技巧总结JavaScript数据结构与算法技巧总结JavaScript遍历算法与技巧总结JavaScript错误与调试技巧总结希望本文所述对大家JavaScript程序设计有所帮助。