javascript創(chuàng)建對象的幾種模式介紹
在js中有幾種模式可以創(chuàng)建對象,通過對象操作所包含的屬性與方法。
一般來說,構(gòu)造函數(shù)名稱的第一個(gè)字母為大寫字母,非構(gòu)造函數(shù)名稱的第一個(gè)字母為小寫字母,當(dāng)然,構(gòu)造函數(shù)與一般函數(shù)唯一的區(qū)別只是調(diào)用的方式不同而已,所以任何函數(shù)只要通過new來調(diào)用,那它就可以作為構(gòu)造函數(shù),若不通過new來調(diào)用,則與一般函數(shù)一樣。
談?wù)勎覍@幾種模式的理解:
工廠模式:創(chuàng)建一個(gè)一般函數(shù),在函數(shù)里創(chuàng)建一個(gè)Object對象,為這個(gè)對象增添屬性與方法,同時(shí)賦予其值,最后返回對象。無法識別對象類型。
構(gòu)造函數(shù)模式:創(chuàng)建構(gòu)造函數(shù),使用this來賦值,每當(dāng)創(chuàng)建一個(gè)實(shí)例時(shí),方法都被創(chuàng)建一次,而每個(gè)方法都執(zhí)行相同的命令,這就多余了。這個(gè)缺點(diǎn)可以通過將方法放到全局環(huán)境中,但是,這樣就沒有封裝性了。不過可以通過原型模式解決。
原型模式:每個(gè)函數(shù)都有一個(gè)prototype屬性,該屬性是一個(gè)指針,指向一個(gè)對象,該對象包含其函數(shù)創(chuàng)建的所有實(shí)例共享的屬性與方法。
原型對象,構(gòu)造函數(shù)以及實(shí)例之間的關(guān)系如下圖:

圖解:1:構(gòu)造函數(shù)以及由構(gòu)造函數(shù)創(chuàng)建的實(shí)例,它們的prototype屬性都指向構(gòu)造函數(shù)的原型對象。
2:構(gòu)造函數(shù)的原型對象具有constructor屬性,該屬性指向構(gòu)造函數(shù)。
3:構(gòu)造函數(shù)的原型對象所包含的所有屬性與方法可以被由構(gòu)造函數(shù)所創(chuàng)建的所有實(shí)例共享。
使用對象字面量重寫原型對象后,constructor則指向object構(gòu)造函數(shù),若需要其指向另一構(gòu)造函數(shù),則需修改原型對象的constructor屬性的值,比如:constructor:Person,這樣Person的原型對象即使被重寫,原型對象的constructor仍指向Person構(gòu)造函數(shù)。
當(dāng)先創(chuàng)建實(shí)例時(shí):若是直接添加屬性或方法,實(shí)例可以訪問。
若是重寫原型對象,則構(gòu)造函數(shù)的prototype指向新的原型對象,而之前創(chuàng)建的實(shí)例的prototype仍指向最初的原型對象,所以實(shí)例訪問不到新的原型對象的新屬性或和新方法。
原型對象包含的是共享的屬性與方法,那么每個(gè)實(shí)例都擁有這些信息,這樣實(shí)例之間就沒有什么不同了,而且還不可以傳參數(shù),這不是我們所想要的。每個(gè)實(shí)例之間有共同的信息,又有不同的信息,所以我們可以組合使用構(gòu)造函數(shù)模式與原型模式。
構(gòu)造函數(shù)模式與原型模式的組合使用:

態(tài)原型模式:將獨(dú)立的構(gòu)造函數(shù)與其原型對象結(jié)合在一起,在構(gòu)造函數(shù)里初始化原型,為其添加方法。

若該方法不存在,則將其添加到原型對象上,只在初始化原型時(shí)才執(zhí)行,而且只執(zhí)行一次。
寄生構(gòu)造函數(shù)模式:與工廠模式類似,區(qū)別為:寄生構(gòu)造函數(shù)模式為構(gòu)造函數(shù),通過new來創(chuàng)建實(shí)例。
穩(wěn)妥構(gòu)造函數(shù)模式:沒有公共的屬性,其方法不引用this的對象。創(chuàng)建實(shí)例時(shí)不使用new。只能通過方法訪問屬性(即傳入的數(shù)據(jù))。
以上這篇javascript創(chuàng)建對象的幾種模式介紹就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
- js面向?qū)ο笾R妱?chuàng)建對象的幾種方式(工廠模式、構(gòu)造函數(shù)模式、原型模式)
- JavaScript中創(chuàng)建對象的7種模式詳解
- JavaScript中創(chuàng)建對象的模式匯總
- js 創(chuàng)建對象 經(jīng)典模式全面了解
- JavaScript創(chuàng)建對象方式總結(jié)【工廠模式、構(gòu)造函數(shù)模式、原型模式等】
- javascript工廠模式和構(gòu)造函數(shù)模式創(chuàng)建對象方法解析
- 在javascript中創(chuàng)建對象的各種模式解析
- 淺析在javascript中創(chuàng)建對象的各種模式
- JavaScript創(chuàng)建對象的四種常用模式實(shí)例分析
- JS 創(chuàng)建對象的模式實(shí)例小結(jié)
相關(guān)文章
Javascript開發(fā)之三數(shù)組對象實(shí)例介紹
Javascript開發(fā)之三組數(shù)對象詳細(xì)介紹,需要的朋友可以參考下2012-11-11
Javascript入門學(xué)習(xí)第六篇 js DOM編程
上篇文章納悶的問題,將在這章和以后的幾章里,慢慢搞定。 從今天起,開始學(xué)習(xí)DOM編程 讓我們慢慢稱為一名初級的js程序員。 然后往js匠人方向發(fā)展。2008-07-07
javascript typeof id===''string''?document.getElementById(id
剛開始學(xué)習(xí)js的朋友可能會(huì)有些疑問,其實(shí)這段代碼使用js的三元運(yùn)算符,這樣代碼看起來高大上,最主要是代碼段少2016-11-11
探討JavaScript中的Rest參數(shù)和參數(shù)默認(rèn)值
這篇文章的主要介紹了JavaScript中的Rest參數(shù)和參數(shù)默認(rèn)值,內(nèi)容很充實(shí),需要了解的朋友可以參考下2015-07-07
javascript中的onkeyup和onkeydown區(qū)別介紹
文本框里輸入的時(shí)候要開始計(jì)算文本框里面輸入了多少字,自然想到了onkeydown事件,然后計(jì)算value.length的方法,下面看下具體的代碼2013-04-04

