Proxy用于修改某些操作的默認行為,等同于在語言層面做出修改,所以屬于一種“元編程”(meta programming),即對編程語言進行編程。
Proxy可以理解成,在目標對象之前架設一層“攔截”,外界對該對象的訪問,都必須先通過這層攔截,因此提供了一種機制,可以對外界的訪問進行過濾和改寫。Proxy這個詞的原意是代理,用在這里表示由它來“代理”某些操作,可以譯為“代理器”。
var obj = new Proxy({}, {
get: function (target, key, receiver) {
console.log(`getting ${key}!`);
return Reflect.get(target, key, receiver);
},
set: function (target, key, value, receiver) {
console.log(`setting ${key}!`);
return Reflect.set(target, key, value, receiver);
}
});
上面代碼對一個空對象架設了一層攔截,重定義了屬性的讀取(get
)和設置(set
)行為。這里暫時先不解釋具體的語法,只看運行結果。對設置了攔截行為的對象obj
,去讀寫它的屬性,就會得到下面的結果。
obj.count = 1
// setting count!
++obj.count
// getting count!
// setting count!
// 2
上面代碼說明,Proxy實際上重載(overload)了點運算符,即用自己的定義覆蓋了語言的原始定義。
ES6原生提供Proxy構造函數(shù),用來生成Proxy實例。
var proxy = new Proxy(target, handler);
Proxy對象的所有用法,都是上面這種形式,不同的只是handler
參數(shù)的寫法。其中,new Proxy()
表示生成一個Proxy實例,target參數(shù)表示所要攔截的目標對象,handler
參數(shù)也是一個對象,用來定制攔截行為。
下面是另一個攔截讀取屬性行為的例子。
var proxy = new Proxy({}, {
get: function(target, property) {
return 35;
}
});
proxy.time // 35
proxy.name // 35
proxy.title // 35
上面代碼中,作為構造函數(shù),Proxy接受兩個參數(shù)。第一個參數(shù)是所要代理的目標對象(上例是一個空對象),即如果沒有Proxy的介入,操作原來要訪問的就是這個對象;第二個參數(shù)是一個配置對象,對于每一個被代理的操作,需要提供一個對應的處理函數(shù),該函數(shù)將攔截對應的操作。比如,上面代碼中,配置對象有一個get
方法,用來攔截對目標對象屬性的訪問請求。get
方法的兩個參數(shù)分別是目標對象和所要訪問的屬性??梢钥吹?,由于攔截函數(shù)總是返回35
,所以訪問任何屬性都得到35
。
注意,要使得Proxy起作用,必須針對Proxy實例(上例是proxy對象)進行操作,而不是針對目標對象(上例是空對象)進行操作。
如果handler
沒有設置任何攔截,那就等同于直接通向原對象。
var target = {};
var handler = {};
var proxy = new Proxy(target, handler);
proxy.a = 'b';
target.a // "b"
上面代碼中,handler
是一個空對象,沒有任何攔截效果,訪問handeler
就等同于訪問target
。
一個技巧是將Proxy對象,設置到object.proxy
屬性,從而可以在object
對象上調(diào)用。
var object = { proxy: new Proxy(target, handler) };
Proxy實例也可以作為其他對象的原型對象。
var proxy = new Proxy({}, {
get: function(target, property) {
return 35;
}
});
let obj = Object.create(proxy);
obj.time // 35
上面代碼中,proxy
對象是obj
對象的原型,obj
對象本身并沒有time
屬性,所以根據(jù)原型鏈,會在proxy
對象上讀取該屬性,導致被攔截。
同一個攔截器函數(shù),可以設置攔截多個操作。
var handler = {
get: function(target, name) {
if (name === 'prototype') {
return Object.prototype;
}
return 'Hello, ' + name;
},
apply: function(target, thisBinding, args) {
return args[0];
},
construct: function(target, args) {
return {value: args[1]};
}
};
var fproxy = new Proxy(function(x, y) {
return x + y;
}, handler);
fproxy(1, 2) // 1
new fproxy(1,2) // {value: 2}
fproxy.prototype === Object.prototype // true
fproxy.foo // "Hello, foo"
下面是Proxy支持的攔截操作一覽。
對于可以設置、但沒有設置攔截的操作,則直接落在目標對象上,按照原先的方式產(chǎn)生結果。
(1)get(target, propKey, receiver)
攔截對象屬性的讀取,比如proxy.foo
和proxy['foo']
。
最后一個參數(shù)receiver
是一個對象,可選,參見下面Reflect.get
的部分。
(2)set(target, propKey, value, receiver)
攔截對象屬性的設置,比如proxy.foo = v
或proxy['foo'] = v
,返回一個布爾值。
(3)has(target, propKey)
攔截propKey in proxy
的操作,以及對象的hasOwnProperty
方法,返回一個布爾值。
(4)deleteProperty(target, propKey)
攔截delete proxy[propKey]
的操作,返回一個布爾值。
(5)ownKeys(target)
攔截Object.getOwnPropertyNames(proxy)
、Object.getOwnPropertySymbols(proxy)
、Object.keys(proxy)
,返回一個數(shù)組。該方法返回對象所有自身的屬性,而Object.keys()
僅返回對象可遍歷的屬性。
(6)getOwnPropertyDescriptor(target, propKey)
攔截Object.getOwnPropertyDescriptor(proxy, propKey)
,返回屬性的描述對象。
(7)defineProperty(target, propKey, propDesc)
攔截Object.defineProperty(proxy, propKey, propDesc)
、Object.defineProperties(proxy, propDescs)
,返回一個布爾值。
(8)preventExtensions(target)
攔截Object.preventExtensions(proxy)
,返回一個布爾值。
(9)getPrototypeOf(target)
攔截Object.getPrototypeOf(proxy)
,返回一個對象。
(10)isExtensible(target)
攔截Object.isExtensible(proxy)
,返回一個布爾值。
(11)setPrototypeOf(target, proto)
攔截Object.setPrototypeOf(proxy, proto)
,返回一個布爾值。
如果目標對象是函數(shù),那么還有兩種額外操作可以攔截。
(12)apply(target, object, args)
攔截Proxy實例作為函數(shù)調(diào)用的操作,比如proxy(...args)
、proxy.call(object, ...args)
、proxy.apply(...)
。
(13)construct(target, args)
攔截Proxy實例作為構造函數(shù)調(diào)用的操作,比如new proxy(...args)
。
下面是上面這些攔截方法的詳細介紹。
get
方法用于攔截某個屬性的讀取操作。上文已經(jīng)有一個例子,下面是另一個攔截讀取操作的例子。
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.");
}
}
});
proxy.name // "張三"
proxy.age // 拋出一個錯誤
上面代碼表示,如果訪問目標對象不存在的屬性,會拋出一個錯誤。如果沒有這個攔截函數(shù),訪問不存在的屬性,只會返回undefined
。
get
方法可以繼承。
let proto = new Proxy({}, {
get(target, propertyKey, receiver) {
console.log('GET '+propertyKey);
return target[propertyKey];
}
});
let obj = Object.create(proto);
obj.xxx // "GET xxx"
上面代碼中,攔截操作定義在Prototype對象上面,所以如果讀取obj
對象繼承的屬性時,攔截會生效。
下面的例子使用get
攔截,實現(xiàn)數(shù)組讀取負數(shù)的索引。
function createArray(...elements) {
let handler = {
get(target, propKey, receiver) {
let index = Number(propKey);
if (index < 0) {
propKey = String(target.length + index);
}
return Reflect.get(target, propKey, receiver);
}
};
let target = [];
target.push(...elements);
return new Proxy(target, handler);
}
let arr = createArray('a', 'b', 'c');
arr[-1] // c
上面代碼中,數(shù)組的位置參數(shù)是-1
,就會輸出數(shù)組的倒數(shù)最后一個成員。
利用Proxy,可以將讀取屬性的操作(get
),轉變?yōu)閳?zhí)行某個函數(shù),從而實現(xiàn)屬性的鏈式操作。
var pipe = (function () {
return function (value) {
var funcStack = [];
var oproxy = new Proxy({} , {
get : function (pipeObject, fnName) {
if (fnName === 'get') {
return funcStack.reduce(function (val, fn) {
return fn(val);
},value);
}
funcStack.push(window[fnName]);
return oproxy;
}
});
return oproxy;
}
}());
var double = n => n * 2;
var pow = n => n * n;
var reverseInt = n => n.toString().split("").reverse().join("") | 0;
pipe(3).double.pow.reverseInt.get; // 63
上面代碼設置Proxy以后,達到了將函數(shù)名鏈式使用的效果。
下面的例子則是利用get
攔截,實現(xiàn)一個生成各種DOM節(jié)點的通用函數(shù)dom
。
const dom = new Proxy({}, {
get(target, property) {
return function(attrs = {}, ...children) {
const el = document.createElement(property);
for (let prop of Object.keys(attrs)) {
el.setAttribute(prop, attrs[prop]);
}
for (let child of children) {
if (typeof child === 'string') {
child = document.createTextNode(child);
}
el.appendChild(child);
}
return el;
}
}
});
const el = dom.div({},
'Hello, my name is ',
dom.a({href: '//example.com'}, 'Mark'),
'. I like:',
dom.ul({},
dom.li({}, 'The web'),
dom.li({}, 'Food'),
dom.li({}, '…actually that\'s it')
)
);
document.body.appendChild(el);
set
方法用來攔截某個屬性的賦值操作。
假定Person
對象有一個age
屬性,該屬性應該是一個不大于200的整數(shù),那么可以使用Proxy
保證age
的屬性值符合要求。
let validator = {
set: function(obj, prop, value) {
if (prop === 'age') {
if (!Number.isInteger(value)) {
throw new TypeError('The age is not an integer');
}
if (value > 200) {
throw new RangeError('The age seems invalid');
}
}
// 對于age以外的屬性,直接保存
obj[prop] = value;
}
};
let person = new Proxy({}, validator);
person.age = 100;
person.age // 100
person.age = 'young' // 報錯
person.age = 300 // 報錯
上面代碼中,由于設置了存值函數(shù)set
,任何不符合要求的age
屬性賦值,都會拋出一個錯誤。利用set
方法,還可以數(shù)據(jù)綁定,即每當對象發(fā)生變化時,會自動更新DOM。
有時,我們會在對象上面設置內(nèi)部屬性,屬性名的第一個字符使用下劃線開頭,表示這些屬性不應該被外部使用。結合get
和set
方法,就可以做到防止這些內(nèi)部屬性被外部讀寫。
var handler = {
get (target, key) {
invariant(key, 'get');
return target[key];
},
set (target, key, value) {
invariant(key, 'set');
return true;
}
};
function invariant (key, action) {
if (key[0] === '_') {
throw new Error(`Invalid attempt to ${action} private "${key}" property`);
}
}
var target = {};
var proxy = new Proxy(target, handler);
proxy._prop
// Error: Invalid attempt to get private "_prop" property
proxy._prop = 'c'
// Error: Invalid attempt to set private "_prop" property
上面代碼中,只要讀寫的屬性名的第一個字符是下劃線,一律拋錯,從而達到禁止讀寫內(nèi)部屬性的目的。
apply
方法攔截函數(shù)的調(diào)用、call和apply操作。
var handler = {
apply (target, ctx, args) {
return Reflect.apply(...arguments);
}
};
apply
方法可以接受三個參數(shù),分別是目標對象、目標對象的上下文對象(this
)和目標對象的參數(shù)數(shù)組。
下面是一個例子。
var target = function () { return 'I am the target'; };
var handler = {
apply: function () {
return 'I am the proxy';
}
};
var p = new Proxy(target, handler);
p()
// "I am the proxy"
上面代碼中,變量p
是Proxy的實例,當它作為函數(shù)調(diào)用時(p()
),就會被apply
方法攔截,返回一個字符串。
下面是另外一個例子。
var twice = {
apply (target, ctx, args) {
return Reflect.apply(...arguments) * 2;
}
};
function sum (left, right) {
return left + right;
};
var proxy = new Proxy(sum, twice);
proxy(1, 2) // 6
proxy.call(null, 5, 6) // 22
proxy.apply(null, [7, 8]) // 30
上面代碼中,每當執(zhí)行proxy
函數(shù)(直接調(diào)用或call
和apply
調(diào)用),就會被apply
方法攔截。
另外,直接調(diào)用Reflect.apply
方法,也會被攔截。
Reflect.apply(proxy, null, [9, 10]) // 38
has
方法用來攔截HasProperty
操作,即判斷對象是否具有某個屬性時,這個方法會生效。典型的操作就是in
運算符。
下面的例子使用has
方法隱藏某些屬性,不被in
運算符發(fā)現(xiàn)。
var handler = {
has (target, key) {
if (key[0] === '_') {
return false;
}
return key in target;
}
};
var target = { _prop: 'foo', prop: 'foo' };
var proxy = new Proxy(target, handler);
'_prop' in proxy // false
上面代碼中,如果原對象的屬性名的第一個字符是下劃線,proxy.has
就會返回false
,從而不會被in
運算符發(fā)現(xiàn)。
如果原對象不可配置或者禁止擴展,這時has
攔截會報錯。
var obj = { a: 10 };
Object.preventExtensions(obj);
var p = new Proxy(obj, {
has: function(target, prop) {
return false;
}
});
'a' in p // TypeError is thrown
上面代碼中,obj
對象禁止擴展,結果使用has
攔截就會報錯。
值得注意的是,?has
?方法攔截的是 ?HasProperty
?操作,而不是 ?HasOwnProperty
?操作,即 ?has
?方法不判斷一個屬性是對象自身的屬性,還是繼承的屬性。
另外,雖然 ?for…in
? 循環(huán)也用到了 ?in
?運算符,但是 ?has
?攔截對 ?for…in
? 循環(huán)不生效。
let stu1 = {name: 'Owen', score: 59};
let stu2 = {name: 'Mark', score: 99};
let handler = {
has(target, prop) {
if (prop === 'score' && target[prop] < 60) {
console.log(`${target.name} 不及格`);
return false;
}
return prop in target;
}
}
let oproxy1 = new Proxy(stu1, handler);
let oproxy2 = new Proxy(stu2, handler);
for (let a in oproxy1) {
console.log(oproxy1[a]);
}
// Owen
// Owen 不及格
for (let b in oproxy2) {
console.log(oproxy2[b]);
}
// Mark
// Mark 99
上面代碼中,?has
?攔截只對?in
?運算符生效,對?for...in
?循環(huán)不生效,導致不符合要求的屬性沒有被?for...in
?循環(huán)所排除。
construct
方法用于攔截new
命令,下面是攔截對象的寫法。
var handler = {
construct (target, args, newTarget) {
return new target(...args);
}
};
construct
方法可以接受兩個參數(shù)。
target
: 目標對象args
:構建函數(shù)的參數(shù)對象下面是一個例子。
var p = new Proxy(function() {}, {
construct: function(target, args) {
console.log('called: ' + args.join(', '));
return { value: args[0] * 10 };
}
});
new p(1).value
// "called: 1"
// 10
construct
方法返回的必須是一個對象,否則會報錯。
var p = new Proxy(function() {}, {
construct: function(target, argumentsList) {
return 1;
}
});
new p() // 報錯
deleteProperty
方法用于攔截delete
操作,如果這個方法拋出錯誤或者返回false
,當前屬性就無法被delete
命令刪除。
var handler = {
deleteProperty (target, key) {
invariant(key, 'delete');
return true;
}
};
function invariant (key, action) {
if (key[0] === '_') {
throw new Error(`Invalid attempt to ${action} private "${key}" property`);
}
}
var target = { _prop: 'foo' };
var proxy = new Proxy(target, handler);
delete proxy._prop
// Error: Invalid attempt to delete private "_prop" property
上面代碼中,deleteProperty
方法攔截了delete
操作符,刪除第一個字符為下劃線的屬性會報錯。
defineProperty
方法攔截了Object.defineProperty
操作。
var handler = {
defineProperty (target, key, descriptor) {
return false;
}
};
var target = {};
var proxy = new Proxy(target, handler);
proxy.foo = 'bar'
// TypeError: proxy defineProperty handler returned false for property '"foo"'
上面代碼中,defineProperty
方法返回false
,導致添加新屬性會拋出錯誤。
getOwnPropertyDescriptor
方法攔截Object.getOwnPropertyDescriptor
,返回一個屬性描述對象或者undefined
。
var handler = {
getOwnPropertyDescriptor (target, key) {
if (key[0] === '_') {
return;
}
return Object.getOwnPropertyDescriptor(target, key);
}
};
var target = { _foo: 'bar', baz: 'tar' };
var proxy = new Proxy(target, handler);
Object.getOwnPropertyDescriptor(proxy, 'wat')
// undefined
Object.getOwnPropertyDescriptor(proxy, '_foo')
// undefined
Object.getOwnPropertyDescriptor(proxy, 'baz')
// { value: 'tar', writable: true, enumerable: true, configurable: true }
上面代碼中,handler.getOwnPropertyDescriptor
方法對于第一個字符為下劃線的屬性名會返回undefined
。
getPrototypeOf
方法主要用來攔截Object.getPrototypeOf()
運算符,以及其他一些操作。
Object.prototype.__proto__
Object.prototype.isPrototypeOf()
Object.getPrototypeOf()
Reflect.getPrototypeOf()
instanceof
運算符下面是一個例子。
var proto = {};
var p = new Proxy({}, {
getPrototypeOf(target) {
return proto;
}
});
Object.getPrototypeOf(p) === proto // true
上面代碼中,getPrototypeOf
方法攔截Object.getPrototypeOf()
,返回proto
對象。
isExtensible
方法攔截Object.isExtensible
操作。
var p = new Proxy({}, {
isExtensible: function(target) {
console.log("called");
return true;
}
});
Object.isExtensible(p)
// "called"
// true
上面代碼設置了isExtensible
方法,在調(diào)用Object.isExtensible
時會輸出called
。
這個方法有一個強限制,如果不能滿足下面的條件,就會拋出錯誤。
Object.isExtensible(proxy) === Object.isExtensible(target)
下面是一個例子。
var p = new Proxy({}, {
isExtensible: function(target) {
return false;
}
});
Object.isExtensible(p) // 報錯
ownKeys
方法用來攔截Object.keys()
操作。
let target = {};
let handler = {
ownKeys(target) {
return ['hello', 'world'];
}
};
let proxy = new Proxy(target, handler);
Object.keys(proxy)
// [ 'hello', 'world' ]
上面代碼攔截了對于target
對象的Object.keys()
操作,返回預先設定的數(shù)組。
下面的例子是攔截第一個字符為下劃線的屬性名。
let target = {
_bar: 'foo',
_prop: 'bar',
prop: 'baz'
};
let handler = {
ownKeys (target) {
return Reflect.ownKeys(target).filter(key => key[0] !== '_');
}
};
let proxy = new Proxy(target, handler);
for (let key of Object.keys(proxy)) {
console.log(target[key]);
}
// "baz"
preventExtensions
方法攔截Object.preventExtensions()
。該方法必須返回一個布爾值。
這個方法有一個限制,只有當Object.isExtensible(proxy)
為false
(即不可擴展)時,proxy.preventExtensions
才能返回true
,否則會報錯。
var p = new Proxy({}, {
preventExtensions: function(target) {
return true;
}
});
Object.preventExtensions(p) // 報錯
上面代碼中,proxy.preventExtensions
方法返回true
,但這時Object.isExtensible(proxy)
會返回true
,因此報錯。
為了防止出現(xiàn)這個問題,通常要在proxy.preventExtensions
方法里面,調(diào)用一次Object.preventExtensions
。
var p = new Proxy({}, {
preventExtensions: function(target) {
console.log("called");
Object.preventExtensions(target);
return true;
}
});
Object.preventExtensions(p)
// "called"
// true
setPrototypeOf
方法主要用來攔截Object.setPrototypeOf
方法。
下面是一個例子。
var handler = {
setPrototypeOf (target, proto) {
throw new Error('Changing the prototype is forbidden');
}
};
var proto = {};
var target = function () {};
var proxy = new Proxy(target, handler);
proxy.setPrototypeOf(proxy, proto);
// Error: Changing the prototype is forbidden
上面代碼中,只要修改target
的原型對象,就會報錯。
Proxy.revocable方法返回一個可取消的Proxy實例。
let target = {};
let handler = {};
let {proxy, revoke} = Proxy.revocable(target, handler);
proxy.foo = 123;
proxy.foo // 123
revoke();
proxy.foo // TypeError: Revoked
Proxy.revocable
方法返回一個對象,該對象的proxy
屬性是Proxy
實例,revoke
屬性是一個函數(shù),可以取消Proxy
實例。上面代碼中,當執(zhí)行revoke
函數(shù)之后,再訪問Proxy
實例,就會拋出一個錯誤。
Reflect
對象與Proxy
對象一樣,也是ES6為了操作對象而提供的新API。Reflect
對象的設計目的有這樣幾個。
(1) 將Object
對象的一些明顯屬于語言內(nèi)部的方法(比如Object.defineProperty
),放到Reflect
對象上?,F(xiàn)階段,某些方法同時在Object
和Reflect
對象上部署,未來的新方法將只部署在Reflect
對象上。
(2) 修改某些Object方法的返回結果,讓其變得更合理。比如,Object.defineProperty(obj, name, desc)
在無法定義屬性時,會拋出一個錯誤,而Reflect.defineProperty(obj, name, desc)
則會返回false
。
// 老寫法
try {
Object.defineProperty(target, property, attributes);
// success
} catch (e) {
// failure
}
// 新寫法
if (Reflect.defineProperty(target, property, attributes)) {
// success
} else {
// failure
}
(3) 讓Object
操作都變成函數(shù)行為。某些Object
操作是命令式,比如name in obj
和delete obj[name]
,而Reflect.has(obj, name)
和Reflect.deleteProperty(obj, name)
讓它們變成了函數(shù)行為。
// 老寫法
'assign' in Object // true
// 新寫法
Reflect.has(Object, 'assign') // true
(4)Reflect
對象的方法與Proxy
對象的方法一一對應,只要是Proxy
對象的方法,就能在Reflect
對象上找到對應的方法。這就讓Proxy
對象可以方便地調(diào)用對應的Reflect
方法,完成默認行為,作為修改行為的基礎。也就是說,不管Proxy
怎么修改默認行為,你總可以在Reflect
上獲取默認行為。
Proxy(target, {
set: function(target, name, value, receiver) {
var success = Reflect.set(target,name, value, receiver);
if (success) {
log('property ' + name + ' on ' + target + ' set to ' + value);
}
return success;
}
});
上面代碼中,Proxy
方法攔截target
對象的屬性賦值行為。它采用Reflect.set
方法將值賦值給對象的屬性,然后再部署額外的功能。
下面是另一個例子。
var loggedObj = new Proxy(obj, {
get(target, name) {
console.log('get', target, name);
return Reflect.get(target, name);
},
deleteProperty(target, name) {
console.log('delete' + name);
return Reflect.deleteProperty(target, name);
},
has(target, name) {
console.log('has' + name);
return Reflect.has(target, name);
}
});
上面代碼中,每一個Proxy
對象的攔截操作(get
、delete
、has
),內(nèi)部都調(diào)用對應的Reflect方法,保證原生行為能夠正常執(zhí)行。添加的工作,就是將每一個操作輸出一行日志。
有了Reflect
對象以后,很多操作會更易讀。
// 老寫法
Function.prototype.apply.call(Math.floor, undefined, [1.75]) // 1
// 新寫法
Reflect.apply(Math.floor, undefined, [1.75]) // 1
Reflect
對象的方法清單如下,共13個。
上面這些方法的作用,大部分與Object
對象的同名方法的作用都是相同的,而且它與Proxy
對象的方法是一一對應的。下面是對其中幾個方法的解釋。
(1)Reflect.get(target, name, receiver)
查找并返回target
對象的name
屬性,如果沒有該屬性,則返回undefined
。
如果name
屬性部署了讀取函數(shù),則讀取函數(shù)的this綁定receiver
。
var obj = {
get foo() { return this.bar(); },
bar: function() { ... }
};
// 下面語句會讓 this.bar()
// 變成調(diào)用 wrapper.bar()
Reflect.get(obj, "foo", wrapper);
(2)Reflect.set(target, name, value, receiver)
設置target
對象的name
屬性等于value
。如果name
屬性設置了賦值函數(shù),則賦值函數(shù)的this
綁定receiver
。
(3)Reflect.has(obj, name)
等同于name in obj
。
(4)Reflect.deleteProperty(obj, name)
等同于delete obj[name]
。
(5)Reflect.construct(target, args)
等同于new target(...args)
,這提供了一種不使用new
,來調(diào)用構造函數(shù)的方法。
(6)Reflect.getPrototypeOf(obj)
讀取對象的__proto__
屬性,對應Object.getPrototypeOf(obj)
。
(7)Reflect.setPrototypeOf(obj, newProto)
設置對象的__proto__
屬性,對應Object.setPrototypeOf(obj, newProto)
。
(8)Reflect.apply(fun,thisArg,args)
等同于Function.prototype.apply.call(fun,thisArg,args)
。一般來說,如果要綁定一個函數(shù)的this對象,可以這樣寫fn.apply(obj, args)
,但是如果函數(shù)定義了自己的apply
方法,就只能寫成Function.prototype.apply.call(fn, obj, args)
,采用Reflect對象可以簡化這種操作。
另外,需要注意的是,Reflect.set()
、Reflect.defineProperty()
、Reflect.freeze()
、Reflect.seal()
和Reflect.preventExtensions()
返回一個布爾值,表示操作是否成功。它們對應的Object方法,失敗時都會拋出錯誤。
// 失敗時拋出錯誤
Object.defineProperty(obj, name, desc);
// 失敗時返回false
Reflect.defineProperty(obj, name, desc);
上面代碼中,Reflect.defineProperty
方法的作用與Object.defineProperty
是一樣的,都是為對象定義一個屬性。但是,Reflect.defineProperty
方法失敗時,不會拋出錯誤,只會返回false
。
更多建議: