Reflect

Reflect 對(duì)象和Proxy對(duì)象一樣, 為操作對(duì)象提供了新的API。

為什么使用 Reflect的方式來操作對(duì)象?

• 將 Object 對(duì)象上一些明顯屬于內(nèi)部的方法放到 Reflect對(duì)象上。比如 Object.defindProperty 也可以使用 Reflect.defindProperty

• 修改某些 Object 方法的返回結(jié)果

• 讓 Object 操作都變成函數(shù)行為。

• Reflect 對(duì)象的操作方法和 Proxy的方法一一對(duì)應(yīng), 很方便 Proxy對(duì)象來調(diào)用 Reflect 方法

例子:

    const sum = function (num1, num2) {return num1 + num2}const proxy = new Proxy(sum, {apply(target, context, args) {return Reflect.apply(...arguments) * 2}})proxy(1,2)  // 6

以上代碼 proxy 的配置方法 apply和 Reflect的apply方法是對(duì)應(yīng)關(guān)系,直接通過 Reflect.apply 來調(diào)用攔截函數(shù) sum。并將函數(shù)執(zhí)行后的結(jié)果 * 2。最終的結(jié)果是 6。

#### Reflect 對(duì)象和 Proxy的靜態(tài)方法一樣,同樣是13個(gè)。

• Reflect.apply(target, context, args)
• Reflect.get(target, key, context)
• Reflect.set(target, key, value, context)
• Reflect.construct(target, args)
• Reflect.defindProperty(target, key, desc)
• Reflect.has(target, key)
• Reflect.deleteProperty(target, key)
• Reflect.setProperty(target, proto)
• Reflect.getProperty(target)
• Reflect.ownKeys(target)
• Reflect.isExtensible(target)
• Reflect.preventExtensions(target)
• Reflect.getOwnPropertyDescriptor(target, key)

Reflect.get(target, key, context)

target: 查找的對(duì)象
key: 查找的屬性
context: 讀取getter函數(shù)的上下文對(duì)象

    const obj = {name: 'qiqingfu',get sayName() {console.log(this.name)}}const obj1 = {name: 'zhangfei'}Reflect.get(obj, 'name')  // qiqingfu Reflect.get(obj, 'sayName', obj1) // zhangfei 

如果第一個(gè)參數(shù)不是對(duì)象, Reflect.get方法會(huì)報(bào)錯(cuò)。

Reflect.set(target, key, value, context)

target: 要給哪個(gè)對(duì)象設(shè)置
key: 要設(shè)置的屬性
value: 設(shè)置的值
返回值: boolean

    const obj = {value: 1,set fn(newValue) {return this.value = newValue}}  console.log(Reflect.set(obj, 'name', 'qiqingfu'))  // trueconsole.log(Reflect.set(obj, 'fn', 2))console.log(obj)

以上代碼,給obj對(duì)象設(shè)置了一個(gè)name屬性,其值為qiqingfu, 并且設(shè)置fn的時(shí)候被get函數(shù)攔截到了。

Reflect.has(target, key) 方法檢測(cè) target對(duì)象上有么有 key這個(gè)屬性

返回值: boolean

const obj = {name: 'qiqingfu',a: 2}console.log(Reflect.has(obj, 'name'))  // trueconsole.log(Reflect.has(obj, 'a'))     // trueconsole.log(Reflect.has(obj, 'b'))     // false

其實(shí) Reflect.has 和 in 操作符類似。

Reflect.construct(target, args) 方法用于類似于 new 操作符

target: 目標(biāo)函數(shù)
args: 實(shí)例化對(duì)象需要傳遞的參數(shù) Array
返回值: 實(shí)例對(duì)象

    function Prosen (name, age) {this.name = name;this.age = age}const prosen = Reflect.construct(Prosen, ['qiqingfu', 22])// {name: 'qiqingfu', age: 22}

以上代碼使用 Reflect.construct方法實(shí)例話一個(gè)對(duì)象,接受的參數(shù)為數(shù)組類型

Reflect.defineProperty(target, key, decs) 和 Object.defineProperty(target, key, decs) 一樣

更推崇使用前者。

方法會(huì)直接在一個(gè)對(duì)象上定義一個(gè)新屬性，或者修改一個(gè)對(duì)象的現(xiàn)有屬性， 并返回這個(gè)對(duì)象。

    const obj = {}Reflect.defineProperty(obj, 'a', {value: 1,configurable: true, // 可配置writable: true      // 可寫})// {a: 1}

以上代碼給 obj 對(duì)象添加了一個(gè) a屬性, 其值為1并且是可配置和可修改的

Reflect.deleteProperty(target, key) 方法刪除 target對(duì)象的key屬性

    const obj = {a: 1}Reflect.defindProperty(obj, 'a')console.log(obj) // {}

Reflect.getPropertyOf(target) 方法獲取一個(gè)對(duì)象的原型對(duì)象

    function Prosen() {}Prosen.prototype.age = 21const prosen = Reflect.construct(Prosen, [])// 獲取原型對(duì)象的屬性 const proto = Reflect.getPrototypeOf(prosen)console.log(proto)// {age: 21, constructor: ?}

以上代碼 給 Prosen 構(gòu)造函數(shù)的原型對(duì)象上添加了一個(gè) age屬性。并且通過 Reflect.construct方法實(shí)例化一個(gè)對(duì)象。那么就可以通過 Reflect.getPrototypeOf 方法獲取一個(gè)對(duì)象的原型對(duì)象。

Reflect.setPrototypeOf(target, proto) 方法將 proto設(shè)置為 target對(duì)象的原型對(duì)象

    function Prosen() {}Prosen.prototype.age = 21const prosen = Reflect.construct(Prosen, [])// 設(shè)置prosen 的原型對(duì)象Reflect.setPrototypeOf(prosen, {b: 2}) 

此時(shí), prosen的原型對(duì)象為 {b:2}, 而 construct 指針會(huì)被覆蓋

Reflect.ownKeys(target) 獲取對(duì)象的key值,返回值為數(shù)組

和 Object.ownKeys 相同。

    const obj = {a: 1,[Symbol('c')]: 3,}Reflect.defineProperty(obj, 'b', {value: 2,configurable: true,enumerable: true})console.log(Reflect.ownKeys(obj))// ["a", "b", Symbol(c)]

返回值是一個(gè)數(shù)組, 存放著對(duì)象的 key值的集合。

Reflect.getOwnPropertyDescriptor(target, key) 方法獲取一個(gè)對(duì)象key值的描述對(duì)象

返回值: Object

    const obj = {a: 1,[Symbol('c')]: 3,}Reflect.defineProperty(obj, 'b', {value: 2,configurable: true,enumerable: true})const decs = Reflect.getOwnPropertyDescriptor(obj, 'b')console.log(decs)/*{value: 2, writable: false, enumerable: true, configurable: true}*/

以上代碼通過 Reflect.getOwnPropertyDescriptor方法獲取一個(gè)對(duì)象屬性的描述對(duì)象, 如果第一個(gè)參數(shù)不是對(duì)象會(huì)報(bào)錯(cuò)。而在 Object.getOwnPropertyDescriptor不會(huì)報(bào)錯(cuò),只不過返回 undefind

轉(zhuǎn)載于:https://www.cnblogs.com/qiqingfu/p/10013336.html

總結(jié)

以上是生活随笔為你收集整理的ES6 Reflect使用笔记的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。