ES6中Proxy與Reflect實(shí)現(xiàn)重載(overload)的方法
本文實(shí)例講述了ES6中Proxy與Reflect實(shí)現(xiàn)重載(overload)的方法。分享給大家供大家參考,具體如下:
Proxy與Reflect實(shí)現(xiàn)重載(overload)
從語(yǔ)法角度講JavaScript不支持重載。原因很簡(jiǎn)單,JS中函數(shù)可以傳入任意類型、任意個(gè)數(shù)的參數(shù),通通可以通過在函數(shù)內(nèi)使用this.arguments獲得。這樣,就無法實(shí)現(xiàn)同名函數(shù)參數(shù)列表不同實(shí)現(xiàn)不同功能。當(dāng)然,在實(shí)際使用過程中,可以人為去檢測(cè)傳入實(shí)參的個(gè)數(shù)及類型,來進(jìn)行不同操作。但是,我認(rèn)為這不能叫做重載。
ES6帶來了Proxy和Reflect,配合使用可以實(shí)現(xiàn)重載。Proxy用于修改某些操作的默認(rèn)行為,相當(dāng)于對(duì)原始想進(jìn)行的操作進(jìn)行“包裝”;Reflect對(duì)象的方法與Proxy對(duì)象的方法一一對(duì)應(yīng),這使得Proxy對(duì)象可以方便的調(diào)用對(duì)應(yīng)的Reflect方法完成默認(rèn)行為。我們可以這樣使用它們:
function LogMessage( m ){ this.m = m; } var message = new LogMessage( 1 ); var overload = new Proxy(message , { 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); } }); overload.m = 2; //setting m var s = overload.m; //getting m
看到了沒,是不是很有意思,新創(chuàng)建的Proxy對(duì)象overload可以完成目標(biāo)對(duì)象message的操作,同時(shí),可以通過在默認(rèn)操作之前自定義一些其他操作。我認(rèn)為,這更像Java里的重載。
那么Proxy與Reflect有哪些實(shí)例方法呢?
1.get()
用于攔截某個(gè)屬性的讀取操作。
2.set()
用于攔截某個(gè)屬性的賦值操作。
3.has()
可以隱藏某些屬性,不被in操作符遍歷到。
4.construct()
用于攔截new命令。
5.deleteProperty()
用于攔截delete操作。
6.defineProperty()
用于攔截Object.defineProperty操作。
7.enumerate()
用于攔截for...in循環(huán)。
8.getOwnPropertyDescriptor()
用于攔截Object.getOwnPropertyDescriptor操作。
9.isExtensible()
用于攔截Object.isExtensible操作。
10.preventExtensions()
用于攔截Object.preventExtensions操作。
11.setPrototypeOf()
用于攔截Object.setPrototypeOf操作。
上面很多方法不是很常用,如果感興趣可以去查查相關(guān)資料
希望本文所述對(duì)大家ECMAScript程序設(shè)計(jì)有所幫助。
- 詳解ES6中的代理模式——Proxy
- 實(shí)例解析ES6 Proxy使用場(chǎng)景介紹
- 詳細(xì)探究ES6之Proxy代理
- ES6中Proxy代理用法實(shí)例淺析
- 淺談es6語(yǔ)法 (Proxy和Reflect的對(duì)比)
- ES6之Proxy的get方法詳解
- JavaScript中的ES6 Proxy的具體使用
- ES6 Proxy實(shí)現(xiàn)Vue的變化檢測(cè)問題
- ES6知識(shí)點(diǎn)整理之Proxy的應(yīng)用實(shí)例詳解
- ES6 proxy和reflect的使用方法與應(yīng)用實(shí)例分析
- ES6中javascript實(shí)現(xiàn)函數(shù)綁定及類的事件綁定功能詳解
- ES6使用新特性Proxy實(shí)現(xiàn)的數(shù)據(jù)綁定功能實(shí)例
相關(guān)文章
ajax讀取數(shù)據(jù)后使用jqchart顯示圖表的方法
這篇文章主要介紹了ajax讀取數(shù)據(jù)后使用jqchart顯示圖表的方法,涉及Ajax操作及圖表插件的相關(guān)使用技巧,需要的朋友可以參考下2015-06-06

詳解js創(chuàng)建對(duì)象的幾種方式和對(duì)象方法

prototype與jquery下Ajax實(shí)現(xiàn)的差別

JS實(shí)現(xiàn)數(shù)組淺拷貝和深拷貝的方法

firefox TBODY 用js顯示和隱藏時(shí)出現(xiàn)錯(cuò)位的解決方法