JavaScript有哪些創建對象的方式

這篇文章主要為大家展示了“JavaScript有哪些創建對象的方式”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“JavaScript有哪些創建對象的方式”這篇文章吧。

1 創建對象

1.1 一般方法

使用Object或者采用對象字面量的方法。

var o = {a: 1};
var o2=new Object();
o2.a=1;

缺點：使用同一個接口創建很多對象，會產生大量重復的代碼。

1.2工廠模式

function parent(name,age){
  var Child = new Object();
  Child.name=name;
  Child.age=age;
  Child.sayHi=function(){
    console.log("Hi");
  }
  return Child;
};
var x = Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

函數parent能夠根據接受的參數來構建一個包含所有必要信息的child對象。可以無限次調用這個函數，都會返回一個包含兩個屬性和一個方法的對象。

解決了創建多個相似對象的問題，但卻沒有解決對象識別的問題（即怎樣知道一個對象的類型）。

1.3構造函數模式

對于構造函數這個名字，學過java或者c++的同學應該都是知道的，在js里也是差不多的。

用構造函數將上面的例子重寫如下：

function Parent(name,age){
  this.name=name;
  this.age=age;
  this.sayHi=function(){
    console.log("Hi");
  };
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

對于構造函數，我們需要在調用的時候加關鍵字 new。要注意的是，構造函數始終是以一個大寫字母開頭，而非構造函數始終是以一個小寫字母開頭。

與工廠模式相比，主要有以下幾個不同之處：

• 沒有顯示地創建對象；

• 直接將屬性和方法賦給了this對象；

• 沒有return語句。

缺點：使用構造函數的缺點就是每個方法都需要在每個實例上重新創建一遍。

1.4原型模式

我們創建的每一個函數都有一個prototype（原型）屬性，這個屬性是一個指針，指向一個對象，而這個對象的用途是包含可以由特定類型的所有實例共享的屬性與方法。使用原型對象的好處是可以讓所有的對象實例共享其包含的屬性與方法。

function Parent(name,age){
  Parent.prototype.name=name;
  Parent.prototype.age=age;
  Parent.prototype.sayHi=function(){
    console.log("Hi");
  };
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

缺點：優點就是其缺點，方法屬性都可以共享。具體可以看下面這個例子

function Parent(name,age){
  Parent.prototype.name=name;
  Parent.prototype.age=age;
  Parent.prototype.arr=["123","we"];
  Parent.prototype.sayHi=function(){
    console.log("Hi");
  };
}
var x = new Parent("Tom",12);
var y = new Parent("Tom1",12);
x.arr.push("x");
y.arr.push("y");
console.log(x.arr);//["123", "we", "x", "y"]
console.log(y.arr);//["123", "we", "x", "y"]

對象x修改自己的屬性，竟然會影響到y對象；同理，對y也一樣。這個明顯就很不合理啊，太可怕了！

1.5組合使用構造函數模式和原型模式

function Parent(name,age){
　　//只把屬性留在這里定義，方法放在原型對象中
  this.name=name;
  this.age=age;
}
//第一種方式
Parent.prototype.sayHi=function(){
  console.log("Hi");
};
//第二種方式
//由于采用對象字面量，因此必須修正其constructor屬性；
Parent.prototype={
  constructor:Parent,
  sayHi:function(){
    console.log("Hi");
  }
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

在這個例子中，實例屬性都是在構造函數中定義的，而由所有實例共享的屬性constructor和方法則是在原型中定義的。

是目前使用最廣泛、認同度最高的一種創建自定義類型的方法。

--------------------------感覺后面幾種方法有些變態了--------------------------------

1.6 動態原型模式

function Parent(name,age){
  this.name=name;
  this.age=age;
  if( typeof this.sayHi !="function"){
    Parent.prototype.sayHi=function(){
      console.log("Hi");
    };
  }
}
var x = new Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

先檢查某個應該存在方法是否有效再來決定是否需要初始化原型。

1.7寄生構造函數模式

當前面幾種都不適用的情況下，可以使用寄生構造函數模式。這種函數的基本思想是創建一個函數，該函數的作用僅僅是封裝創建對象的代碼，然后再返回新創建的對象。

function parent(name,age){
  var Child = new Object();
  Child.name=name;
  Child.age=age;
  Child.sayHi=function(){
    console.log("Hi");
  }
  return Child;
};
var x = Parent("Tom",12);
console.log(x.name); //Tom
x.sayHi(); //Hi

但是其實就是和工廠模式一模一樣，你ＴＭ在逗我嗎？？？？？

1.8穩妥構造函數模式

穩妥構造函數遵循與寄生構造函數模式類似的模式，但有兩點不同：一是新創建對象的實例方法不引用this; 二是不使用new操作調用構造函數。

function Parent(name,age){
  var o=new Object();
　　 //私有變量或者方法
  var name=name,
    age=age;
  o.sayName=function(){
　　　　 //name前面沒有this
    console.log(name+" "+age)
  }
  return o;
}
var x = Parent("Tom",12);
x.sayName(); //Tom 12

變量x中保存的是一個穩妥對象，而除了調用sayName()方法外，沒有別的方式可以訪問其數據成員。

以上是“JavaScript有哪些創建對象的方式”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！