亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

js中創(chuàng)建對(duì)象的幾種方式示例介紹

 更新時(shí)間:2014年01月26日 15:27:48   作者:  
JavaScript中的所有事物都是對(duì)象,本文為大家介紹下JS中創(chuàng)建對(duì)象的幾種方式,如原始方法、工廠方法等等
JavaScript中的所有事物都是對(duì)象:字符串、數(shù)組、數(shù)值、函數(shù)等。JS中并沒有類的概念,

但我們可以利用JS的語法特征,以類的思想來創(chuàng)建對(duì)象。

原始方法
復(fù)制代碼 代碼如下:

<script type="text/javascript">

var obj = new Object();
obj.name = "Koji"; //為對(duì)象添加屬性
obj.age = 21;
obj.showName = function(){ //為對(duì)象添加方法
alert(this.name);
}
obj.showAge = function(){
alert(this.age);
}

obj.showName(); //Koji
obj.showAge(); //21

</script>

上面的方式通過new關(guān)鍵字生成一個(gè)對(duì)象,然后根據(jù)JS是動(dòng)態(tài)語言的特性添加屬性和方法,構(gòu)

造一個(gè)對(duì)象。其中的this是表示調(diào)用該方法的對(duì)象。

這種方式的問題是如果需要多次創(chuàng)建對(duì)象,則需要重復(fù)代碼多次,不利于代碼的復(fù)用。

工廠方法
復(fù)制代碼 代碼如下:

<script type="text/javascript">

function createObj(){
var obj = new Object(); //創(chuàng)建對(duì)象

obj.name = "Koji";
obj.age = 21;
obj.showName = function(){
alert(this.name);
}
obj.showAge = function(){
alert(this.age);
}

return obj; //返回對(duì)象
}

var obj1 = createObj();
var obj2 = createObj();

obj1.showName(); //Koji
obj2.showAge(); //21

</script>

這種方式提高了代碼重用率,還可以改變工廠方法,傳入?yún)?shù)賦值。
復(fù)制代碼 代碼如下:

<script type="text/javascript">

function createObj(name, age){ //構(gòu)造對(duì)象時(shí)可以傳入初始化參數(shù)
var obj = new Object(); //創(chuàng)建對(duì)象

obj.name = name;
obj.age = age;
obj.showName = function(){
alert(this.name);
}
obj.showAge = function(){
alert(this.age);
}

return obj; //返回對(duì)象
}

var obj1 = createObj("Koji", 22);
var obj2 = createObj("Luo", 21);

obj1.showName(); //Koji
obj1.showAge(); //22
obj2.showName(); //Luo
obj2.showAge(); //21

</script>

上面的方式雖然可以提高代碼的復(fù)用率,但和面向?qū)ο笾蓄惖母拍钕啾扔幸粋€(gè)很大的缺陷。面

相對(duì)象強(qiáng)調(diào)對(duì)象的屬性私有,而對(duì)象的方法是共享的。而上面的工廠方法創(chuàng)建對(duì)象的時(shí)候要為每個(gè)

對(duì)象創(chuàng)建各自私有的方法。同時(shí)由于為每個(gè)對(duì)象都創(chuàng)建邏輯相同的方法,浪費(fèi)內(nèi)存。改進(jìn)如下
復(fù)制代碼 代碼如下:

<span style="font-size:14px;"><script type="text/javascript">

function createObj(name, age){
var obj = new Object(); //創(chuàng)建對(duì)象

obj.name = name;
obj.age = age;
obj.showName = showName;
obj.showAge = showAge;

return obj; //返回對(duì)象
}

function showName(){ //函數(shù)也是一個(gè)對(duì)象
alert(this.name);
}

function showAge(){
alert(this.age);
}

var obj1 = createObj("Koji", 22);
var obj2 = createObj("Luo", 21);

obj1.showName(); //Koji
obj1.showAge(); //22
obj2.showName(); //Luo
obj2.showAge(); //21

</script></span>

上面通過定義連個(gè)函數(shù)對(duì)象,解決了不同對(duì)象持有函數(shù)對(duì)象的私有問題?,F(xiàn)在所有對(duì)象的方法都

持有上面兩個(gè)函數(shù)的引用。但這么一來的話,對(duì)象的函數(shù)又和對(duì)象成了相互獨(dú)立,不相干的了。這和

面向?qū)ο笾刑囟ǚ椒▽儆谔囟惖乃枷氩环稀?

構(gòu)造函數(shù)方式
復(fù)制代碼 代碼如下:

<script type="text/javascript">

//定義一個(gè)構(gòu)造函數(shù),用來生成對(duì)應(yīng)的對(duì)象,可以類比Java中的構(gòu)造函數(shù)
function Person(name, age){

//當(dāng)調(diào)用new Person的時(shí)候,在執(zhí)行第一行代碼前,先生成一個(gè)Person對(duì)象,并將對(duì)象在內(nèi)存中的
//索引賦值給this關(guān)鍵字,此時(shí)可以通過this關(guān)鍵字操作新生成的對(duì)象,如下面的添加屬性或方法

this.name = name; //this關(guān)鍵字不能少。為當(dāng)前對(duì)象,即this關(guān)鍵字引用的對(duì)象的name屬性賦值
//,實(shí)際相當(dāng)于為當(dāng)前對(duì)象添加name屬性后,再為其name屬性賦值。
this.age = age;

this.showName = function(){ //為當(dāng)前對(duì)象添加方法
alert(this.name);
}
this.showAge = function(){
alert(this.age);
}

//將當(dāng)前對(duì)象返回給賦值符號(hào)左邊的變量(不必明確使用return)
}

var obj1 = new Person("Koji", 22); //生成一個(gè)Person對(duì)象
var obj2 = new Person("Luo", 21);

obj1.showName(); //Koji
obj1.showAge(); //22
obj2.showName(); //Luo
obj2.showAge(); //21

</script>

構(gòu)造函數(shù)的方式和工廠方式一樣,會(huì)為每個(gè)對(duì)象創(chuàng)建獨(dú)享的函數(shù)對(duì)象。當(dāng)然也可以將這些函數(shù)

對(duì)象定義在構(gòu)造函數(shù)外面,這樣又有了對(duì)象和方法相互獨(dú)立的問題。

原型方法:該方法利用的對(duì)象的prototype屬性
復(fù)制代碼 代碼如下:

script type="text/javascript">

function Person(){} //定義一個(gè)空構(gòu)造函數(shù),且不能傳遞參數(shù)

//將所有的屬性的方法都賦予prototype屬性

Person.prototype.name = "Koji"; //添加屬性
Person.prototype.age = 22;

Person.prototype.showName = function(){ //添加方法
alert(this.name);
}

Person.prototype.showAge = function(){
alert(this.age);
}

var obj1 = new Person(); //生成一個(gè)Person對(duì)象
var obj2 = new Person();

obj1.showName(); //Koji
obj1.showAge(); //22
obj2.showName(); //Koji
obj2.showAge(); //22

</script>

當(dāng)生成Person對(duì)象的時(shí)候prototype的屬性都賦值給了新的對(duì)象。那么屬性和方法是共享的。

該方法的問題首先是構(gòu)造函數(shù)不能傳參,每個(gè)新生成的對(duì)象都有默認(rèn)值。其次,方法共享沒有

任何問題,但是屬性共享就有問題,當(dāng)屬性是可改變狀態(tài)的對(duì)象的時(shí)候。
復(fù)制代碼 代碼如下:

<script type="text/javascript">

function Person(){} //定義一個(gè)空構(gòu)造函數(shù),且不能傳遞參數(shù)

Person.prototype.age = 22;
Person.prototype.array = new Array("Koji", "Luo");

Person.prototype.showAge = function(){
alert(this.age);
}

Person.prototype.showArray = function(){
alert(this.array);
}

var obj1 = new Person(); //生成一個(gè)Person對(duì)象
var obj2 = new Person();

obj1.array.push("Kyo"); //向obj1的array屬性添加一個(gè)元素

obj1.showArray(); //Koji,Luo,Kyo
obj2.showArray(); //Koji,Luo,Kyo

</script>

上面的代碼通過obj1向obj1的屬性array添加元素的時(shí)候,obj2的arra屬性的元素也跟著受到

影響,原因就在于obj1和obj2對(duì)象的array屬性引用的是同一個(gè)Array對(duì)象,那么改變這個(gè)Array

對(duì)象,另一引用該Array對(duì)象的屬性自然也會(huì)受到影響

混合的構(gòu)造函數(shù)/原型方式

使用構(gòu)造函數(shù)定義對(duì)象的屬性,使用原型(prototype)定義對(duì)象的方法,這樣就可以做到屬性

私有,而方法共享。
復(fù)制代碼 代碼如下:

<script type="text/javascript">

function Person(name, age) {
this.name = name;
this.age = age;
this.array = new Array("Koji", "Luo");
}

Person.prototype.showName = function() {
alert(this.name);
}

Person.prototype.showArray = function() {
alert(this.array);
}

var obj1 = new Person("Koji", 22); //生成一個(gè)Person對(duì)象
var obj2 = new Person("Luo", 21);

obj1.array.push("Kyo"); //向obj1的array屬性添加一個(gè)元素

obj1.showArray(); //Koji,Luo,Kyo
obj1.showName(); //Koji
obj2.showArray(); //Koji,Luo
obj2.showName(); //Luo

</script>

屬性私有后,改變各自的屬性不會(huì)影響別的對(duì)象。同時(shí),方法也是由各個(gè)對(duì)象共享。在語義上,

這符合了面相對(duì)象編程的要求。

動(dòng)態(tài)原型方法
復(fù)制代碼 代碼如下:

<script type="text/javascript">

function Person(name, age) {
this.name = name;
this.age = age;
this.array = new Array("Koji", "Luo");

//如果Person對(duì)象中的_initialized為undefined,表明還沒有為Person的原型添加方法
if (typeof Person._initialized == "undefined")
{
Person.prototype.showName = function() {
alert(this.name);
}

Person.prototype.showArray = function() {
alert(this.array);
}

Person._initialized = true; //設(shè)置為true,不必再為prototype添加方法
}
}

var obj1 = new Person("Koji", 22); //生成一個(gè)Person對(duì)象
var obj2 = new Person("Luo", 21);

obj1.array.push("Kyo"); //向obj1的array屬性添加一個(gè)元素

obj1.showArray(); //Koji,Luo,Kyo
obj1.showName(); //Koji
obj2.showArray(); //Koji,Luo
obj2.showName(); //Luo

</script>

這種方法和構(gòu)造函數(shù)/原型方式大同小異。只是將方法的添加放到了構(gòu)造函數(shù)之中,同時(shí)在構(gòu)造

函數(shù)Person上添加了一個(gè)屬性用來保證if語句只能成功執(zhí)行一次

在實(shí)際應(yīng)用中采用最廣泛的是構(gòu)造函數(shù)/原型方法。動(dòng)態(tài)原型方法也很流行,它在功能上和構(gòu)造

函數(shù)/原型方法是等價(jià)的。不要單獨(dú)使用構(gòu)造函數(shù)或原型方法。

相關(guān)文章

最新評(píng)論