小編給大家分享一下JavaScript創(chuàng)建對象的方式有哪些，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

成都創(chuàng)新互聯(lián)公司是一家專業(yè)從事成都做網(wǎng)站、網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計的品牌網(wǎng)絡(luò)公司。如今是成都地區(qū)具影響力的網(wǎng)站設(shè)計公司,作為專業(yè)的成都網(wǎng)站建設(shè)公司,成都創(chuàng)新互聯(lián)公司依托強大的技術(shù)實力、以及多年的網(wǎng)站運營經(jīng)驗,為您提供專業(yè)的成都網(wǎng)站建設(shè)、營銷型網(wǎng)站建設(shè)及網(wǎng)站設(shè)計開發(fā)服務(wù)！

JavaScript創(chuàng)建對象的方式有很多，通過Object構(gòu)造函數(shù)或?qū)ο笞置媪康姆绞揭部梢詣?chuàng)建單個對象，顯然這兩種方式會產(chǎn)生大量的重復(fù)代碼，并不適合量產(chǎn)。接下來介紹七種非常經(jīng)典的創(chuàng)建對象的方式，他們也各有優(yōu)缺點。

工廠模式

function createPerson(name, job) { 
 var o = new Object() 
 o.name = name 
 o.job = job 
 o.sayName = function() { 
  console.log(this.name) 
 } 
 return o 
} 
var person1 = createPerson('Jiang', 'student') 
var person2 = createPerson('X', 'Doctor')

可以無數(shù)次調(diào)用這個工廠函數(shù)，每次都會返回一個包含兩個屬性和一個方法的對象

工廠模式雖然解決了創(chuàng)建多個相似對象的問題，但是沒有解決對象識別問題，即不能知道一個對象的類型

構(gòu)造函數(shù)模式

function Person(name, job) { 
 this.name = name 
 this.job = job 
 this.sayName = function() { 
  console.log(this.name) 
 } 
} 
var person1 = new Person('Jiang', 'student') 
var person2 = new Person('X', 'Doctor')

沒有顯示的創(chuàng)建對象，使用new來調(diào)用這個構(gòu)造函數(shù)，使用new后會自動執(zhí)行如下操作

創(chuàng)建一個新對象

這個新對象會被執(zhí)行[[prototype]]鏈接

這個新對象會綁定到函數(shù)調(diào)用的this

返回這個對象

使用這個方式創(chuàng)建對象可以檢測對象類型

person1 instanceof Object // true 
person1 instanceof Person //true

但是使用構(gòu)造函數(shù)創(chuàng)建對象，每個方法都要在每個實例上重新創(chuàng)建一次

原型模式

function Person() { 
} 
Person.prototype.name = 'Jiang' 
Person.prototype.job = 'student' 
Person.prototype.sayName = function() { 
 console.log(this.name) 
} 
var person1 = new Person()

將信息直接添加到原型對象上。使用原型的好處是可以讓所有的實例對象共享它所包含的屬性和方法，不必在構(gòu)造函數(shù)中定義對象實例信息。

原型是一個非常重要的概念，在一篇文章看懂proto和prototype的關(guān)系及區(qū)別中講的非常詳細(xì)

更簡單的寫法

function Person() { 
} 
Person.prototype = { 
 name: 'jiang', 
 job: 'student', 
 sayName: function() { 
  console.log(this.name) 
 } 
} 
var person1 = new Person()

將Person.prototype設(shè)置為等于一個以對象字面量形式創(chuàng)建的對象，但是會導(dǎo)致.constructor不在指向Person了。

使用這種方式，完全重寫了默認(rèn)的Person.prototype對象，因此 .constructor也不會存在這里

Person.prototype.constructor === Person // false

如果需要這個屬性的話，可以手動添加

function Person() { 
} 
Person.prototype = { 
 constructor：Person 
 name: 'jiang', 
 job: 'student', 
 sayName: function() { 
  console.log(this.name) 
 } 
}

不過這種方式還是不夠好，應(yīng)為constructor屬性默認(rèn)是不可枚舉的，這樣直接設(shè)置，它將是可枚舉的。所以可以時候，Object.defineProperty方法

Object.defineProperty(Person.prototype, 'constructor', { 
 enumerable: false, 
 value: Person 
})

缺點

使用原型，所有的屬性都將被共享，這是個很大的優(yōu)點，同樣會帶來一些缺點

原型中所有屬性實例是被很多實例共享的，這種共享對于函數(shù)非常合適。對于那些包含基本值的屬性也勉強可以，畢竟實例屬性可以屏蔽原型屬性。但是引用類型值，就會出現(xiàn)問題了

function Person() { 
} 
Person.prototype = { 
 name: 'jiang', 
 friends: ['Shelby', 'Court'] 
} 
var person1 = new Person() 
var person2 = new Person() 
person1.friends.push('Van') 
console.log(person1.friends) //["Shelby", "Court", "Van"] 
console.log(person2.friends) //["Shelby", "Court", "Van"] 
console.log(person1.friends === person2.friends) // true

friends存在與原型中，實例person1和person2指向同一個原型，person1修改了引用的數(shù)組，也會反應(yīng)到實例person2中

組合使用構(gòu)造函數(shù)模式和原型模式

這是使用最為廣泛、認(rèn)同度最高的一種創(chuàng)建自定義類型的方法。它可以解決上面那些模式的缺點

使用此模式可以讓每個實例都會有自己的一份實例屬性副本，但同時又共享著對方法的引用

這樣的話，即使實例屬性修改引用類型的值，也不會影響其他實例的屬性值了

function Person(name) { 
 this.name = name 
 this.friends = ['Shelby', 'Court'] 
} 
Person.prototype.sayName = function() { 
 console.log(this.name) 
} 
var person1 = new Person() 
var person2 = new Person() 
person1.friends.push('Van') 
console.log(person1.friends) //["Shelby", "Court", "Van"] 
console.log(person2.friends) // ["Shelby", "Court"] 
console.log(person1.friends === person2.friends) //false

動態(tài)原型模式

動態(tài)原型模式將所有信息都封裝在了構(gòu)造函數(shù)中，初始化的時候，通過檢測某個應(yīng)該存在的方法時候有效，來決定是否需要初始化原型

function Person(name, job) { 
  // 屬性 
 this.name = name 
 this.job = job 
 // 方法 
 if(typeof this.sayName !== 'function') { 
  Person.prototype.sayName = function() { 
    console.log(this.name) 
  } 
 } 
} 
var person1 = new Person('Jiang', 'Student') 
person1.sayName()

只有在sayName方法不存在的時候，才會將它添加到原型中。這段代碼只會初次調(diào)用構(gòu)造函數(shù)的時候才會執(zhí)行。

此后原型已經(jīng)完成初始化，不需要在做什么修改了

這里對原型所做的修改，能夠立即在所有實例中得到反映

其次，if語句檢查的可以是初始化之后應(yīng)該存在的任何屬性或方法，所以不必用一大堆的if語句檢查每一個屬性和方法，只要檢查一個就行

寄生構(gòu)造函數(shù)模式

這種模式的基本思想就是創(chuàng)建一個函數(shù)，該函數(shù)的作用僅僅是封裝創(chuàng)建對象的代碼，然后再返回新建的對象

function Person(name, job) { 
  var o = new Object() 
 o.name = name 
 o.job = job 
 o.sayName = function() { 
  console.log(this.name) 
 } 
 return o 
} 
var person1 = new Person('Jiang', 'student') 
person1.sayName()

這個模式，除了使用new操作符并把使用的包裝函數(shù)叫做構(gòu)造函數(shù)之外，和工廠模式幾乎一樣

構(gòu)造函數(shù)如果不返回對象，默認(rèn)也會返回一個新的對象，通過在構(gòu)造函數(shù)的末尾添加一個return語句，可以重寫調(diào)用構(gòu)造函數(shù)時返回的值

穩(wěn)妥構(gòu)造函數(shù)模式

首先明白穩(wěn)妥對象指的是沒有公共屬性，而且其方法也不引用this。

穩(wěn)妥對象最適合在一些安全環(huán)境中(這些環(huán)境會禁止使用this和new)，或防止數(shù)據(jù)被其他應(yīng)用程序改動時使用

穩(wěn)妥構(gòu)造函數(shù)模式和寄生模式類似，有兩點不同:一是創(chuàng)建對象的實例方法不引用this，而是不使用new操作符調(diào)用構(gòu)造函數(shù)

function Person(name, job) { 
 var o = new Object() 
 o.name = name 
 o.job = job 
 o.sayName = function() { 
  console.log(name) 
 } 
 return o 
} 
var person1 = Person('Jiang', 'student') 
person1.sayName()

和寄生構(gòu)造函數(shù)模式一樣，這樣創(chuàng)建出來的對象與構(gòu)造函數(shù)之間沒有什么關(guān)系，instanceof操作符對他們沒有意義

看完了這篇文章，相信你對“JavaScript創(chuàng)建對象的方式有哪些”有了一定的了解，如果想了解更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司行業(yè)資訊頻道，感謝各位的閱讀！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站www.rwnh.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。

網(wǎng)頁名稱：JavaScript創(chuàng)建對象的方式有哪些-創(chuàng)新互聯(lián)
本文路徑：http://www.rwnh.cn/article4/dghgoe.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁設(shè)計公司、ChatGPT、動態(tài)網(wǎng)站、定制網(wǎng)站、商城網(wǎng)站、面包屑導(dǎo)航

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)