亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

ES7 裝飾者模式Decorator

aaron / 3270人閱讀

摘要：裝飾者模式可以動(dòng)態(tài)的給某個(gè)對(duì)象添加一些額外的職責(zé)，但是卻不會(huì)影響其它的從這個(gè)類中派生出的其它對(duì)象。裝飾者模式能夠能夠在不改變自身對(duì)象的基礎(chǔ)上，在程序運(yùn)行期間給對(duì)象動(dòng)態(tài)的添加功能。裝飾者是一種即用即付的方式，與繼承相比更是一種靈活輕便的做法。

什么是decorator

在程序開發(fā)過程中，我們可能希望某個(gè)類或者方法，并不是天生就具有很龐大，但是又不是很常用的功能。裝飾者模式可以動(dòng)態(tài)的給某個(gè)對(duì)象添加一些額外的職責(zé)，但是卻不會(huì)影響其它的從這個(gè)類中派生出的其它對(duì)象。
裝飾者模式能夠能夠在不改變自身對(duì)象的基礎(chǔ)上，在程序運(yùn)行期間給對(duì)象動(dòng)態(tài)的添加功能。這其實(shí)就像我們?cè)谟螒蛑幸o游戲角色買裝備一樣，同一個(gè)角色本身的各種屬性都是一樣的，但是當(dāng)我們給它穿上不同的裝備后，角色的各種屬性就會(huì)出現(xiàn)差異。

應(yīng)用實(shí)例

首先創(chuàng)建一個(gè)類

function gengerateHP(target) {
    target.hp = 1000
}
@generateHP
class Role {    
}
const role = new Role()
console.log(role.hp)    //undefined
console.log(Role.hp)   //1000

其實(shí)在這里就產(chǎn)生了疑問，為什么這個(gè)hp屬性是加在了Role這個(gè)類上，而類的實(shí)例卻沒有這個(gè)屬性，我們知道類本身指向的是構(gòu)造函數(shù)，它的方法都被定義在prototype屬性上。那么為什么類有hp屬性，而它的實(shí)例卻沒有hp這個(gè)屬性呢，這說明hp屬性并沒有被定義在prototype屬性上，屬于類卻不屬于某個(gè)實(shí)例。

decorator的原理

decorator的實(shí)現(xiàn)原理是以來ES5的Object.defineProperty方法的而Object.defineProperty()方法所做的就是為一個(gè)對(duì)象添加新的屬性，或者更改對(duì)象的某個(gè)已經(jīng)存在的屬性。
它的調(diào)用方式是

Object.defineProperty(target, prop, descriptor) {
}

其中第一個(gè)參數(shù)是代表目標(biāo)對(duì)象，prop代表對(duì)象的屬性名，descriptor是對(duì)屬性的描述，其字段決定了prop屬性的一些特性，比如writable屬性就決定了目標(biāo)對(duì)象的屬性是否可以更改。

function noWrite(target, prop, desc) {
    desc.writable = false
    return desc
}
class Man {
    @noWrite
    name() {
        return "小明"
    }
}
const xiaoming = new Man()
xiaoming.name = "xiaoming"

這里就會(huì)報(bào)錯(cuò)： TypeError: Cannot assign to read only property ‘name’
總結(jié)起來說，decorate裝飾器模式其實(shí)就是在我們需要某個(gè)臨時(shí)的屬性或方法時(shí)，給目標(biāo)對(duì)象加上這個(gè)屬性或者方法。裝飾者是一種’即用即付’的方式，與繼承相比更是一種靈活輕便的做法。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/80267.html

相關(guān)文章

  • ES7-Decorator-裝飾者模式

    摘要：裝飾者要實(shí)現(xiàn)這些相同的方法繼承自裝飾器對(duì)象創(chuàng)建具體的裝飾器，也是接收作對(duì)參數(shù)接下來我們要為每一個(gè)功能創(chuàng)建一個(gè)裝飾者對(duì)象，重寫父級(jí)方法，添加我們想要的功能。 裝飾模式 僅僅包裝現(xiàn)有的模塊，使之 更加華麗 ，并不會(huì)影響原有接口的功能 —— 好比你給手機(jī)添加一個(gè)外殼罷了，并不影響手機(jī)原有的通話、充電等功能； 使用 ES7 的 decorator ES7 中增加了一個(gè) decorator 屬性...

    zhangxiangliang 評(píng)論0 收藏0

  • 5 分鐘即可掌握的 JavaScript 裝飾者模式與 AOP

    摘要：下裝飾者的實(shí)現(xiàn)了解了裝飾者模式和的概念之后，我們寫一段能夠兼容的代碼來實(shí)現(xiàn)裝飾者模式原函數(shù)拍照片定義函數(shù)裝飾函數(shù)加濾鏡用裝飾函數(shù)裝飾原函數(shù)這樣我們就實(shí)現(xiàn)了抽離拍照與濾鏡邏輯，如果以后需要自動(dòng)上傳功能，也可以通過函數(shù)來添加。 showImg(https://segmentfault.com/img/bVbueyz?w=852&h=356); 什么是裝飾者模式 當(dāng)我們拍了一張照片準(zhǔn)備發(fā)朋友...

    chunquedong 評(píng)論0 收藏0

  • JS設(shè)計(jì)模式--裝飾者模式

    摘要：當(dāng)接口比較多，裝飾器也比較多時(shí)，可以獨(dú)立抽取一個(gè)裝飾器父類，實(shí)現(xiàn)目標(biāo)類的所有接口，再創(chuàng)建真正的裝飾器來繼承這個(gè)父類。四的實(shí)現(xiàn)方式提供了一種類似的注解的語法糖，來實(shí)現(xiàn)裝飾者模式。 歡迎關(guān)注我的公眾號(hào)睿Talk，獲取我最新的文章：showImg(https://segmentfault.com/img/bVbmYjo); 一、前言 所謂裝飾者模式，就是動(dòng)態(tài)的給類或?qū)ο笤黾勇氊?zé)的設(shè)計(jì)模式。它...

    wmui 評(píng)論0 收藏0

  • Decorator:從原理到實(shí)踐，我一點(diǎn)都不虛~

    摘要：描述符必須是這兩種形式之一不能同時(shí)是兩者?？梢允侨魏斡行У闹禂?shù)值，對(duì)象，函數(shù)等。當(dāng)且僅當(dāng)該屬性的為時(shí)，才能被賦值運(yùn)算符改變。特點(diǎn)就是不影響之前對(duì)象的特性，而新增額外的職責(zé)功能。 前言 原文鏈接:[Nealyang/personalBlog]() showImg(https://segmentfault.com/img/remote/1460000018958861); ES6 已經(jīng)不必...

    XanaHopper 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<