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