JavaScript物件的建立

2021-08-18 19:02:52 字數 3299 閱讀 8240

var person =new object();

person.name="cjh";

person.age=19;

var person=
需要注意的是,花括號內,成員與成員之間以逗號隔開,而最後乙個成員後不能跟逗號,否則會在ie7及更早的版本中報錯。成員名也可以直接使用字串。其一大優點是可以向函式傳遞大量引數。如下

function show(arg)

if(typeof arg=="number")

alert(output);

}show();

雖然可以用上述兩種建立方式,但使用同乙個介面建立很多物件時會產生大量**。由於在ecmascript中沒有類的概念,開發人員發明了更為高效的幾種方法來建立物件。

**如下

function creat(name);

return o;

}

然而,工廠模式並不能解決物件的識別問題,無法知道乙個物件的型別,於是又有了下面這種建立方式

將上面的例子用建構函式模式重寫

function person(name);

}var me=new person("cjh");

這個建構函式裡沒有顯式創造物件,而是直接將屬性和方法賦值給this物件,也沒有返回值。還應注意到建構函式的首字母應當大寫以此與非建構函式相區分。

在使用建構函式建立物件時實際上經歷了如下四個步驟

(1).建立乙個新物件;

(2).將建構函式的作用域賦給新物件;

(3).執行建構函式中的**;

(4).返回新物件

由建構函式生成的物件,都有乙個constructor屬性指向其建構函式person,該物件既是object的例項,又是person的例項。

應當注意,建構函式也是函式,如果不通過new進行呼叫,也可以作為普通函式將屬性新增到this中,亦可在另乙個物件中呼叫。

那麼這種建立方式有沒有缺陷呢?當然有。在每次使用建構函式時,每乙個方法都會被重新建立一遍,也就是說建立兩個物件的o1和o2的相同方法實際上指的不是同乙個函式。這個問題大可如下改進

function person(name)

function sayname()

可惜這種建立方式使建立物件的過程毫無封裝性可言。於是,原型模式應運而生!

使用建構函式建立的物件都有乙個prototype屬性,該屬性是乙個指標指向乙個物件,即此物件的原型物件。直接貼**

function person(){}

person.prototype.name="cjh";

person.prototype.sayname=function();

var p1=new person;

p1.sayname();//"cjh"

這種方法建立的物件共有相同的方法和同一組屬性。

無論何時建立了乙個新函式,都會為該函式建立乙個prototype屬性,這個屬性指向函式的原型物件。預設下,所有prototype物件都會有乙個constructor屬性:指向prototype屬性所在函式的指標,即上文中的建構函式。而使用建構函式建立物件例項的時候,會在例項中自動建立乙個[[prototype]]指標,指向例項的原型物件。該指標不能被任何方式訪問到。

我們可以用isprototy()peof方法來確認

alert(person.prototype.isprototypeof(p1));//true

ecmascript5增加了乙個叫object.getprototypeof()的方法可以返回[[prototype]]的值,例如

alert(object.getprototypeof(p1).name)//"cjh"

雖然可以通過訪問例項返回原型的屬性值,但卻不能通過例項改變原型的屬性值。如果我們在例項中新增了乙個屬性,而該屬性與原型中的屬性重名,那麼該屬性會在這個例項裡遮蔽掉原型中那個屬性,如下

function person(){}

person.prototype.name="cjh";

var p1=new person();

p1.name="ctc";

var p2=new person();

alert(p1.name)//"ctc"

alert(p2.name)//"cjh"

使用hasownproperty()方法可以檢測乙個屬性是否存在與例項中還是存在與原型中。這個方法在給定屬性存在於物件例項時才返回true。

function person(){}

person.prototype.name="cjh";

var p1=new person();

alert(p1.hasownproperty("name"));//false

p1.name="ctc";

alert(p1.hasownproperty("name"));//true

通過這個方法,屬性存在於例項還是原型一目了然

更簡單的原型語法

用原型模式建立物件時每個屬性都要打一遍person.prototype。為了減少不必要的**,常用乙個包含所有屬性和方法的物件字面量來重寫原型物件。

function(){}

person.prototype=;

}

可是,使用這種方式的話,constructor屬性不再指向person了。這種方法完全重新建立了原型物件,constructor物件也指向了object。

我們可以在重構原型物件時新增「constructor:person,」既可。

在原型修改或新增的屬性後在所有例項中會對應發生響應。然而重構整個prototype物件的話,情況就不同了。因為重構之後切斷了原型與建構函式之間的聯絡。

原型模式的缺點

省略傳參過程會帶來許多不便,但這不是最大的問題。當包含引用型別屬性時,問題就突出了。創造的例項中的所有對應屬性都指向同一引用。因此我們有了下面這種方式

這是js中最常用的建立物件的方式了,簡而言之就是將例項屬性在建構函式中定義,將所有共有屬性和方法在建構函式的prototype中進行定義,可以完美解決上文中原型模式的缺點。**不貼了

這篇文章只是做乙個粗略的介紹,而且還剩下動態原型模式,寄生建構函式模式,穩妥建構函式模式沒有講,天色已晚,以後補充。

javascript物件的建立

function createoject name,return object var aa createoject zhangsan nan aa.run 利用第一種方式的問題就是不能識別他是什麼物件 function myobject name,var testobect new myobjec...

JavaScript建立物件

一 建立單個物件 方式一 object建構函式 var o new object o.key value 方式二 物件字面量 方式一和二缺點 使用相同的介面建立很多物件會產生大量重複 使用方式三解決 方式三 工廠模式 使用函式封裝以特定介面建立物件的細節 function createobject ...

JavaScript 建立物件

工廠模式抽象了建立具體物件的過程,能夠快速建立大量具有相似屬性及方法的物件。function createperson name,age,job obj.name name obj.age age obj.job job obj.sayname function return obj var per...