JavaScript對象創(chuàng)建方式

方式 1:字面量(直接量)創(chuàng)建對象

形式 :主要通過 var obj = { ... };語句進行創(chuàng)建。

優(yōu)點 :1)創(chuàng)建方式簡單,快捷,清晰,適用于創(chuàng)建單個或非常少量或屬性方法非常沒有規(guī)律的對象。
2)創(chuàng)建和添加屬性及屬性值可以在一個語句完成。
缺點 :1)創(chuàng)建效率低,不適用于程序化地生成多個對象。
2)生成的對象不具有相應的對象類型,只是一個個單獨的對象。

方式 2: new Object()創(chuàng)建對象

形式 :主要通過 var obj = new Object();語句先創(chuàng)建一個對象(此時完全等價于 var obj = {}; 語句 ),然后再對這個對象進行添加相應的屬性和屬性值。

優(yōu)點 :相對來說更直觀看出是在創(chuàng)建一個對象。

缺點 :1)創(chuàng)建過程麻煩,創(chuàng)建和添加屬性及屬性值要分兩個步驟完成。
2)創(chuàng)建效率低,不適用于程序化地生成多個對象。
3)生成的對象不具有相應的對象類型,只是一個個單獨的對象。

方式 3:工廠模式(工廠方法、工廠方式)創(chuàng)建對象

形式 :通過調用同一個函數(shù)生成多個對象

function createPerson (name,age,sex) {//工廠方式創(chuàng)建對象
    var p = {};             //方式1
    p.name = name;
    p.age = age;
    p.sex = sex;
    return p;
//  var p = {               //方式2  
//      name : name;
//      age : age;
//      sex : sex;
//  }
//  return p;
//  return {    //方式3(ES6 新增,此時需考慮兼容性)
//      name,   //  此時相當于 name = name; 以下依次類推
//      age,
//      sex
//  }
}

var p1 = createPerson("張三",120,"男");
var p2 = createPerson("李四",56,"女");

優(yōu)點 :1)可以通過調用同一個函數(shù)生成多個對象,提高代碼的效率。
2)可以使用一些ES6新增的較為簡潔的書寫方式寫在封裝函數(shù)里,但是需考慮兼容性。

缺點 :1)當只定義單個對象時書寫過于麻煩,累贅。
2)生成的對象不具有相應的對象類型,只是一個個單獨的對象。

方式 4 :通過構造函數(shù)創(chuàng)建對象

形式 :使用var obj = new 類型名(屬性值);和調用同一個函數(shù)(此時這個函數(shù)叫構造函數(shù))方式創(chuàng)建對象

function Person (name,age,sex) {  
    this.name = name; // 如果調用時用的new方式,則this指代將來要創(chuàng)建的那個對象(此時這個函數(shù)叫構造函數(shù)),如果不是用new方式而當作一個普通函數(shù)使用時,則this指的是window
    this.age = age;
    this.sex = sex; 
//  return this;  //new時自動的返回this,可以省略
    當做構造函數(shù)的時候,默認返回的是this;當顯示的去返回一個新的對象,則外面拿到的就是這個新的對象,如果返回的不是一個對象,則返回給外面的還是this
//  return {        //(ES6新增)但是此時即使在調用的時用的new方式雖然返回值使得對象內容相同,但此時對象不是一個類型,與工廠方式效果一樣,故不能這樣用。
//      name,
//      age,
//      sex
//  }
}

var p1 = new Person("張三",120,"男"); //構造函數(shù)方式創(chuàng)建對象
var p2 = new Person("李四",56,"女");

優(yōu)點 :1)可以通過調用同一個函數(shù)生成多個對象,提高代碼的效率。
2)生成的對象具有相應的對象類型,不僅僅只是生成一個個單獨的對象。

缺點 :1)當只定義單個對象時書寫過于麻煩,累贅。
2)不可以使用一些ES6新增的較為簡潔的書寫方式寫在封裝函數(shù)里,不然會造成返回的對象不具有相應的對象類型,而只是一個個單獨的對象。

方式 5:通過原型創(chuàng)建對象

形式 :使用var obj = new 類型名(屬性值);和調用同一個函數(shù)(此時這個函數(shù)叫構造函數(shù))方式創(chuàng)建對象,但是屬性及方法的添加在原型中。

function Person1 (name,age) { 
}
 Person1.prototype = { 
    construcor : Person1,//使原型對象重新指向Person1
    this.name : name,  //原型有屬性共享的缺點
    this.age : age,
    this.add : function () {}, //原型實現(xiàn)方法共享的優(yōu)點
    console.log(this.name + "在說"); //this根據調用方式不同this指代的對象不同
 }
 var p1 = new Person1();

優(yōu)點 :方法共享

缺點 :屬性共享

方式 6:動態(tài)原型創(chuàng)建對象

形式 :通過保留構造函數(shù)和原型的優(yōu)點且避免他們各自的缺點來實現(xiàn)。

function Person1 (name,age) { //構造函數(shù)實現(xiàn)屬性不共享的優(yōu)點
    this.name = name;
    this.age = age;
    this.add = function () {};
    if (!Person1.prototype.speak) {//動態(tài)原型   //if語句用來避免重復性的生成相同的函數(shù)造成內存浪費
        Person1.prototype.speak = function () { //原型實現(xiàn)方法共享的優(yōu)點
            console.log(this.name + "在說");
        }
    } //方法是可以寫在構造函數(shù)外面的,但是為了實現(xiàn)封裝的整體性加到了構造函數(shù)里面。
}
var p = new Person1();

優(yōu)點 :保留構造函數(shù)和原型的優(yōu)點且避免他們各自的缺點。

缺點 :對于具有多個方法時,if語句有點繁瑣。

方式 7:動態(tài)原型演變方式創(chuàng)建對象

形式 :在動態(tài)原型上完善。

function Person1 (option) { //動態(tài)原型演變方式1
//  this.name = option.name;  //添加屬性方式1,屬性名和屬性值的添加在構造函數(shù)中進行
//  this.age = option.age;  
//  this.add = function () {};
//  for(var index in option){ //添加屬性方式2,適用于屬性名及屬性值不修改的情況
//      this[index] = option[index];
//  }
    this._init(option);//動態(tài)原型演變方式2,把屬性的添加整合到原型中
}
Person1.prototype = {
    _init : function (option){//動態(tài)原型演變方式2
        for(var index in option){
            this[index] = option[index];
        }
    },
    constructor : Person1, //讓對象的constructor重新指向Person1
    speak : function () {
        console.log(this.name + "在說");
    }
}
var pp1 = new Person1({name : "張三",age : 30});
var pp2 = new Person1({name : "李四",age : 40});
pp1.speak();//張三在說
pp2.speak();//李四在說
console.log(pp1.speak === pp2.speak); //true
console.log(pp1.add == pp2.add); //false

優(yōu)點 :(1)保留構造函數(shù)和原型的優(yōu)點且避免他們各自的缺點。
(2)把對象的初始化都整合到原型中生成,方便操作,并且避免了if語句的繁瑣。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 博客內容:什么是面向對象為什么要面向對象面向對象編程的特性和原則理解對象屬性創(chuàng)建對象繼承 什么是面向對象 面向對象...
    _Dot912閱讀 1,534評論 3 12
  • 如何優(yōu)雅的去創(chuàng)建一個對象 在javascript中,創(chuàng)建一個對象有很多方法,但很多時候我們得根據我們的需求去選擇其...
    俗三瘋閱讀 377評論 0 0
  • 普通創(chuàng)建對象和字面量創(chuàng)建對象不足之處:雖然 Object 構造函數(shù)或對象字面量都可以用來創(chuàng)建單個對象,但這些方式有...
    believedream閱讀 2,574評論 2 18
  • 簡書Markdown編輯模式設置(web端) 登陸簡書 點擊頁面左側設置 右邊設置里有一個基本設置,基本設置里有一...
    hanhaotian87閱讀 467評論 0 2
  • 這是爺爺家的菜地,爺爺?shù)牟说剡€包括葡萄。 你知道為什么葡萄架是歪的嗎?我覺得應該是上次下暴風雨的時候給吹歪的,其實...
    任雪銀閱讀 524評論 0 0

友情鏈接更多精彩內容