JavaScript之Reflect

上一篇介紹了Proxy里面的示例里已經(jīng)部分用到了Reflect草雕。Reflect也是ES6為了操作對象而提供的新的API栏饮,用以替代直接調用Object的方法。參照MDN

現(xiàn)在Object的一些方法省店,如Object.defineProperty之類的底層方法直接暴露出來其實不夠貼切√袅荆現(xiàn)在這些方法會同時部署到Object和Reflect上,未來的新方法將會只部署到Reflect上魔慷。即使舊的Object的方法能用只锭,也應該盡量改用Reflect來替換,因為它部分修改了舊方法中一些不合理的地方院尔。例如Object.defineProperty如果無法定義屬性會拋出異常蜻展,而Reflect.defineProperty將其改為出錯返回false:

//舊寫法
try {
    Object.defineProperty(target, property, attributes);
    ...
} catch (e) {
    ...
}

//新寫法
if (Reflect.defineProperty(target, property, attributes)) {
    ...
} else {
    ...
}

而且部分Object方法是命令式的,如in邀摆,delete操作纵顾。Reflect將其改成了Reflect.has,Reflect.deleteProperty函數(shù)調用:

//舊寫法
var mycar = {make: "Honda", model: "Accord", year: 1998};
console.log("make" in mycar);    //true
delete mycar.model;
console.log(mycar);  //{ make="Honda",  year=1998}

//新寫法
var mycar = {make: "Honda", model: "Accord", year: 1998};
console.log(Reflect.has(mycar, 'make'));    //true
Reflect.deleteProperty(mycar, 'model');
console.log(mycar);  //{ make="Honda",  year=1998}

Reflect的方法和上一篇介紹的Proxy的handler的13個方法是一一對應的栋盹,且和Object的同名方法的作用都是相同的施逾。只要是Proxy對象的方法,就能在Reflect對象上找到對應的方法例获。你可以在Proxy的攔截方法里汉额,調用Reflect同名的方法來執(zhí)行默認的動作。例如一個能打印log的Proxy對象:

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一文中已經(jīng)詳細介紹了榨汤,因此這里簡要地介紹一下Reflect的這些同名方法蠕搜。

getPrototypeOf / setPrototypeOf

Reflect.getPrototypeOf對應Object.getPrototypeOf(obj) ,用于讀取對象的proto件余。

Reflect.setPrototypeOf對應Object.setPrototypeOf(obj, newProto)讥脐,用于設置對象的proto遭居。

isExtensible / preventExtensions

Reflect.isExtensible對應Object.isExtensible(obj)

Reflect.preventExtensions等同于Object.preventExtensions(obj)

ownKeys / getOwnPropertyDescriptor

Reflect.ownKeys等同于Object.getOwnPropertyNames(target).concat(Object.getOwnPropertySymbols(target))

Reflect.getOwnPropertyDescriptor等同于Object.getOwnPropertyDescriptor(obj, prop)

defineProperty / deleteProperty

Reflect.defineProperty對應Object.defineProperty(obj, prop, descriptor)

Reflect.deleteProperty等同于delete obj[name]

get / set / has

Reflect.get用于獲取對象的name屬性,如果沒有該屬性會返回undefined旬渠。如果name屬性部署了讀取函數(shù)俱萍,則讀取函數(shù)的this綁定receiver。

Reflect.set用于設置對象的name屬性的值告丢。如果name屬性設置了賦值函數(shù)枪蘑,則賦值函數(shù)的this綁定receiver。

Reflect.has等同于name in obj岖免。

apply / construct

Reflect.apply等同于Function.prototype.apply.call(fun,thisArg,args)岳颇。Reflect的寫法相對簡單,例如:

//舊寫法
console.log(Function.prototype.apply.call(Math.floor, undefined, [1.75])); //1

//新寫法
console.log(Reflect.apply(Math.floor, undefined, [1.75])); //1

Reflect.construct等同于new target(…args)颅湘,現(xiàn)在你可以不使用new话侧,就能調用構造函數(shù)。

有關Proxy和Reflect可以閱讀阮一峰的《ECMAScript 6入門》一書闯参。這兩篇內容大量參照了此書瞻鹏。對作者表示感謝。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末鹿寨,一起剝皮案震驚了整個濱河市新博,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌脚草,老刑警劉巖赫悄,帶你破解...
    沈念sama閱讀 216,843評論 6 502
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異馏慨,居然都是意外死亡埂淮,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,538評論 3 392
  • 文/潘曉璐 我一進店門写隶,熙熙樓的掌柜王于貴愁眉苦臉地迎上來同诫,“玉大人,你說我怎么就攤上這事樟澜。” “怎么了叮盘?”我有些...
    開封第一講書人閱讀 163,187評論 0 353
  • 文/不壞的土叔 我叫張陵秩贰,是天一觀的道長。 經(jīng)常有香客問我柔吼,道長毒费,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,264評論 1 292
  • 正文 為了忘掉前任愈魏,我火速辦了婚禮觅玻,結果婚禮上想际,老公的妹妹穿的比我還像新娘。我一直安慰自己溪厘,他們只是感情好胡本,可當我...
    茶點故事閱讀 67,289評論 6 390
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著畸悬,像睡著了一般侧甫。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蹋宦,一...
    開封第一講書人閱讀 51,231評論 1 299
  • 那天披粟,我揣著相機與錄音,去河邊找鬼冷冗。 笑死守屉,一個胖子當著我的面吹牛,可吹牛的內容都是我干的蒿辙。 我是一名探鬼主播拇泛,決...
    沈念sama閱讀 40,116評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼须板!你這毒婦竟也來了碰镜?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 38,945評論 0 275
  • 序言:老撾萬榮一對情侶失蹤习瑰,失蹤者是張志新(化名)和其女友劉穎绪颖,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體甜奄,經(jīng)...
    沈念sama閱讀 45,367評論 1 313
  • 正文 獨居荒郊野嶺守林人離奇死亡柠横,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,581評論 2 333
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了课兄。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片牍氛。...
    茶點故事閱讀 39,754評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖烟阐,靈堂內的尸體忽然破棺而出搬俊,到底是詐尸還是另有隱情,我是刑警寧澤蜒茄,帶...
    沈念sama閱讀 35,458評論 5 344
  • 正文 年R本政府宣布唉擂,位于F島的核電站,受9級特大地震影響檀葛,放射性物質發(fā)生泄漏玩祟。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,068評論 3 327
  • 文/蒙蒙 一屿聋、第九天 我趴在偏房一處隱蔽的房頂上張望空扎。 院中可真熱鬧藏鹊,春花似錦、人聲如沸转锈。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,692評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽黑忱。三九已至宴抚,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間甫煞,已是汗流浹背菇曲。 一陣腳步聲響...
    開封第一講書人閱讀 32,842評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留抚吠,地道東北人常潮。 一個月前我還...
    沈念sama閱讀 47,797評論 2 369
  • 正文 我出身青樓,卻偏偏與公主長得像楷力,于是被迫代替她去往敵國和親喊式。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 44,654評論 2 354

推薦閱讀更多精彩內容

  • 本人自學es6已經(jīng)有一段時間了萧朝,只覺得有些時候很是枯燥無味岔留, 時而又覺得在以后的職業(yè)生涯中會很有用,因為es6的很...
    可樂_37d3閱讀 1,526評論 0 0
  • defineProperty() 學習書籍《ECMAScript 6 入門 》 Proxy Proxy 用于修改某...
    Bui_vlee閱讀 654評論 0 1
  • ECMAScript發(fā)展歷史 (1)ECMA-262 第1版:去除了對針對瀏覽器的特性,支持Unicode標準(多...
    congnie116閱讀 1,875評論 0 2
  • Proxy Proxy用于修改某些操作的默認行為何址,等同于在語言層面作出修改里逆,所以屬于一種“元編程”,即對編程語言進...
    南藍NL閱讀 453評論 0 0
  • Homebrew Cask 快速上手 Homebrew介紹HomeBrew中文網(wǎng)址 Homebrew 是基于 OS...
    Hyman0819閱讀 2,120評論 0 1