這篇文章主要講解了如何使用javascript中的原型模式,內(nèi)容清晰明了,對(duì)此有興趣的小伙伴可以學(xué)習(xí)一下,相信大家閱讀完之后會(huì)有幫助。
讓客戶滿意是我們工作的目標(biāo),不斷超越客戶的期望值來(lái)自于我們對(duì)這個(gè)行業(yè)的熱愛。我們立志把好的技術(shù)通過(guò)有效、簡(jiǎn)單的方式提供給客戶,將通過(guò)不懈努力成為客戶在信息化領(lǐng)域值得信任、有價(jià)值的長(zhǎng)期合作伙伴,公司提供的服務(wù)項(xiàng)目有:國(guó)際域名空間、雅安服務(wù)器托管、營(yíng)銷軟件、網(wǎng)站建設(shè)、長(zhǎng)豐網(wǎng)站維護(hù)、網(wǎng)站推廣。
介紹:在日常的開發(fā)過(guò)程中,我們經(jīng)常會(huì)利用到前端模板引擎來(lái)做頁(yè)面渲染,因?yàn)榇嬖诤芏囗?yè)面結(jié)構(gòu)相同,內(nèi)容不同的場(chǎng)景。這種場(chǎng)景在js層面也會(huì)遇到,
很多組件存在相同或者類似,重復(fù)的創(chuàng)建會(huì)導(dǎo)致系統(tǒng)的消耗,這就要用到原型模式了。將相似內(nèi)容提取出來(lái)作為原型類,創(chuàng)建具體類時(shí)需要對(duì)原型類進(jìn)行復(fù)制然后擴(kuò)展。
需要注意的是,復(fù)制出來(lái)的對(duì)象在進(jìn)行修改時(shí)不會(huì)影響到原型類,二者相互獨(dú)立。
定義:使用原型實(shí)例指定創(chuàng)建對(duì)象的種類,并且通過(guò)克隆這些原型創(chuàng)建新的對(duì)象。原型模式是一種對(duì)象創(chuàng)建型模式。
場(chǎng)景:我們還是基于Dialog類來(lái)實(shí)現(xiàn)原型模式,我將所有彈窗共有的屬性方法抽取出來(lái),每次創(chuàng)建時(shí)通過(guò)復(fù)制其基礎(chǔ)屬性,在此基礎(chǔ)上進(jìn)行完善,然后返回新的對(duì)象。
示例:
var Dialog = function(){ this.init = function(arg){ this.element = arg.element; this.name = arg.name; } this.show = function(){ console.log(this.name + ' is show -> ' + this.element); } }; var createDialog = function(arg){ var _dialog = function(){}; _dialog.prototype = new Dialog(); var resDia = new _dialog(); resDia.init(arg); return resDia; } var notice = createDialog({name:'notice',element:'notice'}); var toast = createDialog({name:'toast',element:'toast'}); var warnin = createDialog({name:'warnin',element:'warnin'}); notice.show(); //notice is show ->noticetoast.show(); //toast is show ->toastwarnin.show(); //warnin is show ->warnin
原型模式總結(jié):
優(yōu)點(diǎn):
* 當(dāng)創(chuàng)建新的對(duì)象實(shí)例較為復(fù)雜時(shí),使用原型模式可以簡(jiǎn)化對(duì)象的創(chuàng)建過(guò)程,通過(guò)復(fù)制一個(gè)已有實(shí)例可以提高新實(shí)例的創(chuàng)建效率。
* 擴(kuò)展性較好
缺點(diǎn):
* 對(duì)已有類進(jìn)行改造時(shí)需要修改源代碼,違背了開關(guān)原則。
看完上述內(nèi)容,是不是對(duì)如何使用javascript中的原型模式有進(jìn)一步的了解,如果還想學(xué)習(xí)更多內(nèi)容,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。