詳解js 創(chuàng)建對(duì)象的幾種方法
在js中創(chuàng)建對(duì)象的方法可分為6種,分別是:基本模式、工廠模式、構(gòu)造函數(shù)模式、原型模式、組合模式、動(dòng)態(tài)原型模式,接下來(lái)分別看下這幾種模式的寫(xiě)法吧
一、基本模式
var person = new Object(); person.name = "孫悟空"; person.weapon = "棒子"; person.run = function () { return this.name + "武器是" + person.weapon; }
二、工廠模式
function creatPerson(name, weapon) { var person = new Object(); person.name = "孫悟空"; person.weapon = "棒子"; person.run = function () { return this.name + "武器是" + person.weapon; } return person; }
缺點(diǎn):1、實(shí)例之間沒(méi)有聯(lián)系;2、沒(méi)有使用new關(guān)鍵字;3、會(huì)造成資源的浪費(fèi),每生成一個(gè)實(shí)例都會(huì)都會(huì)增加一些重復(fù)的內(nèi)容
缺點(diǎn)3如何理解呢:在多次調(diào)用creatPerson方法時(shí),創(chuàng)建對(duì)象的方法run會(huì)生成多個(gè),雖然多個(gè)對(duì)象的方法都是一樣的。
構(gòu)造函數(shù)解決了多個(gè)實(shí)列之間沒(méi)有聯(lián)系的問(wèn)題,可以用instanceof判斷
三、構(gòu)造函數(shù)模式
function creatPerson(name, weapon) { this.name = name; this.weapon = weapon; this.run = function () { return this.name + "武器是" + this.weapon; } } //調(diào)用創(chuàng)建對(duì)象 var wukou =new creatPerson("孫悟空", "棒子");
缺點(diǎn):沒(méi)有解決工廠模式浪費(fèi)內(nèi)存的缺點(diǎn),每創(chuàng)建一個(gè)對(duì)象會(huì)增加很多重復(fù)的東西
為了解決這個(gè)問(wèn)題請(qǐng)看原型模式
四、原型(Prototype)模式
js中規(guī)定,每一個(gè)構(gòu)造函數(shù)都有一個(gè)prototype屬性,指向另一個(gè)對(duì)象,這個(gè)對(duì)象的所有屬性和方法,都會(huì)被構(gòu)造函數(shù)的實(shí)例繼承,可以把那些不變的屬性和方法直接定義在prototype對(duì)象上
function personObj() { } personObj.prototype.name = "孫悟空"; personObj.prototype.weapon = "棒子"; personObj.prototype.run = function () { return this.name + "武器是" + this.weapon; } //創(chuàng)建對(duì)象 var person = new personObj(); //原型模式的另一種寫(xiě)法 function personObj() { } personObj.prototype = { constructor: personObj,//強(qiáng)制指回personObj name: "孫悟空", weapon: "棒子", run: function () { return this.name + "武器是" + this.weapon; } }
缺點(diǎn):構(gòu)造函數(shù)沒(méi)有參數(shù),不能傳參初始化值,因?yàn)椴煌膶?duì)象可能只共享方法,但是不會(huì)共享屬性,為了解決這個(gè)問(wèn)題請(qǐng)看構(gòu)造函數(shù)和原型模式的組合模式,還解決了前面的所有缺點(diǎn),Jquery就是使用的這種方法
五、組合模式
這樣,不同的實(shí)例可有自己特有的屬性,還有共享的方法
function personObj(name,weapon) { this.name = name; this.weapon = weapon; } personObj.prototype = { run: function () { return this.name + "武器是" + this.weapon; } } //創(chuàng)建對(duì)象 var wukou = new personObj("孫悟空", "棒子");
雖然這種創(chuàng)建對(duì)象的方式已經(jīng)夠我們使用了,平時(shí)使用這方式也沒(méi)有問(wèn)題的,當(dāng)然還有一點(diǎn)小問(wèn)題:對(duì)象中的屬性和方法是分開(kāi)的,請(qǐng)看動(dòng)態(tài)原型方法
六、動(dòng)態(tài)原型模式
function personObj(name, weapon) { this.name = name this.weapon = weapon if (typeof this.run != "function") { personObj.prototype = { run: function () { return this.name + "武器是" + this.weapon; } } } } //創(chuàng)建對(duì)象 var wukou = new personObj("孫悟空", "棒子");
函數(shù)中使用 if (typeof this.run != "function")
目的是為了防止創(chuàng)建多個(gè)對(duì)象時(shí),方法執(zhí)行多次
以上所述是小編給大家介紹的js 創(chuàng)建對(duì)象的幾種方法詳解整合,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
js+html5獲取用戶(hù)地理位置信息并在Google地圖上顯示的方法
這篇文章主要介紹了js+html5獲取用戶(hù)地理位置信息并在Google地圖上顯示的方法,涉及html5元素的操作技巧,需要的朋友可以參考下2015-06-06基于javascript代碼實(shí)現(xiàn)通過(guò)點(diǎn)擊圖片顯示原圖片
這篇文章主要介紹了基于javascript代碼實(shí)現(xiàn)通過(guò)點(diǎn)擊圖片顯示原圖片的相關(guān)資料,需要的朋友可以參考下2015-11-11360doc網(wǎng)站不登錄就無(wú)法復(fù)制內(nèi)容的解決方法
這篇文章主要介紹了360doc網(wǎng)站不登錄就無(wú)法復(fù)制內(nèi)容的解決方法,需要的朋友可以參考下2018-01-01JS表單驗(yàn)證方法實(shí)例小結(jié)【電話、身份證號(hào)、Email、中文、特殊字符、身份證號(hào)等】
這篇文章主要介紹了JS表單驗(yàn)證方法,結(jié)合實(shí)例形式總結(jié)分析了常用的表單驗(yàn)證技巧,包括電話、身份證號(hào)、Email、中文、特殊字符、身份證號(hào)等驗(yàn)證方法,需要的朋友可以參考下2017-02-02JavaScript 模式之工廠模式(Factory)應(yīng)用介紹
工廠模式也是對(duì)象創(chuàng)建模式之一,它通常在類(lèi)或類(lèi)的靜態(tài)方法中去實(shí)現(xiàn),本文將詳細(xì)介紹JavaScript 工廠模式2012-11-11簡(jiǎn)單幾行JS Code實(shí)現(xiàn)IE郵件轉(zhuǎn)發(fā)新浪微博
大概就是說(shuō)我們可以用window.external.menuArguments這個(gè)對(duì)象獲取到內(nèi)部的信息,如window,document這些常用的對(duì)象2013-07-07一段多瀏覽器的"復(fù)制到剪貼板"javascript代碼
一段多瀏覽器的"復(fù)制到剪貼板"javascript代碼...2007-03-03javascript 瀏覽器檢測(cè)代碼精簡(jiǎn)版
javascript檢測(cè)瀏覽器精簡(jiǎn)版,需要的朋友可以參考下。2010-03-03