本篇文章給大家?guī)砹岁P(guān)于javascript的相關(guān)知識(shí),其中主要整理了創(chuàng)建多個(gè)對(duì)象方法的相關(guān)問題,包括了字面量方法、工廠模式方法等等內(nèi)容,下面一起來看一下,希望對(duì)大家有幫助。

在開發(fā)過程中我們經(jīng)常會(huì)遇到需要?jiǎng)?chuàng)建很多個(gè)相似的對(duì)象,很可能有很多相同的屬性或方法,那我們創(chuàng)建多個(gè)對(duì)象的方法都有哪些呢?最好的方法有又是哪個(gè)呢?一起來來看看吧!
1、創(chuàng)建多個(gè)對(duì)象——字面量方法
對(duì)象的字面量方方式是創(chuàng)建對(duì)象最常用的方式之一,以字面量方式創(chuàng)建的對(duì)象屬性默認(rèn)是可寫的、可枚舉、可配置。
如下代碼展示了使用字面量方式創(chuàng)建多個(gè)對(duì)象:
// 字面量方式創(chuàng)建多個(gè)對(duì)象
var person1 = {
name: 'jam',
age: 18,
address: '上海市',
eating: function () {
console.log(this.name + '在吃飯')
}
}
var person2 = {
name: 'tom',
age: 20,
address: '北京市',
eating: function () {
console.log(this.name + '在吃飯')
}
}
var person3 = {
name: 'liming',
age: 19,
address: '天津市',
eating: function () {
console.log(this.name + '在吃飯')
}
}經(jīng)過上述示例代碼我們可以看出,僅僅創(chuàng)建了3個(gè)對(duì)象就用了24行,可以看出字面量方式的弊端:創(chuàng)建同樣的對(duì)象時(shí),需要編寫重復(fù)的代碼太多。
2、創(chuàng)建多個(gè)對(duì)象——工廠模式方法
工廠模式其實(shí)是一種常見的設(shè)計(jì)模式;
通常我們會(huì)有一個(gè)工廠方法,通過該工廠方法我們可以產(chǎn)生想要的對(duì)象;
如下代碼展示了使用工廠模式方法創(chuàng)建多個(gè)對(duì)象的操作:
// 工廠函數(shù)方式創(chuàng)建多個(gè)對(duì)象
function createPerson (name, age, address) {
var p = {}
p.name = name
p.age = age
p.address = address
p.eating = function () {
console.log(name + '在吃飯')
}
return p
}
var p1 = createPerson('jam', 19, '上海市')
var p2 = createPerson('tom', 14, '北京市')
var p3 = createPerson('li', 13, '天津市')
p3.eating() // li在吃飯可以看出使用工廠模式方法創(chuàng)建了三個(gè)對(duì)象使用的代碼明顯比字面量少了好多行,but這就是最好的方式了嗎?NO! NO! NO!
工廠模式方法的**弊端**就在于:以上述示例代碼為例。當(dāng)我們打印p1,p2,p3后,獲取不到對(duì)象最真實(shí)的類型,比如p1是人還是動(dòng)物還是工具
3、創(chuàng)建多個(gè)對(duì)象——構(gòu)造函數(shù)方法
構(gòu)造函數(shù)相信大家并不陌生。所謂構(gòu)造函數(shù),就是提供一個(gè)生成對(duì)象的模板,并描述對(duì)象的基本結(jié)構(gòu)的函數(shù)。一個(gè)構(gòu)造函數(shù),可以生成多個(gè)對(duì)象,每個(gè)對(duì)象都有相同的結(jié)構(gòu)。
如下代碼展示了使用構(gòu)造函數(shù)方法創(chuàng)建多個(gè)對(duì)象:
// 約定俗成的規(guī)范,構(gòu)造函數(shù)名字首字母大寫
function Person (name, age, address) {
this.name = name
this.age = age
this.address = address
this.eating = function () {
console.log(this.name + '在吃飯')
}
this.running = function () {
console.log(this.name + '在跑步')
}
}
var p1 = new Person('jam', 20, '北京市')
var p2 = new Person('tom', 14, '上海市')
var p3 = new Person('li', 13, '天津市')
console.log(p1)
// 輸出結(jié)果
// Person {
// name: 'jam',
// age: 20,
// address: '北京市',
// eating: [Function],
// running: [Function]
// }
p1.eating() // jam在吃飯構(gòu)造函數(shù)有個(gè)不成文的規(guī)范,那就是構(gòu)造函數(shù)的名字首字母大寫或者駝峰。
構(gòu)造函數(shù)方式并不是最完美的創(chuàng)建多個(gè)對(duì)象的方式,也是有缺點(diǎn)的。
缺點(diǎn):每個(gè)方法都要在每個(gè)實(shí)例上重新創(chuàng)建一遍,比如同樣的eating方法和running方法都需要在p1,p2,p3的實(shí)例上去創(chuàng)建一遍,浪費(fèi)很多的內(nèi)存空間
4、創(chuàng)建多個(gè)對(duì)象——原型加構(gòu)造函數(shù)方式
二者的組合模式即在構(gòu)造函數(shù)上定義實(shí)例屬性,那么在創(chuàng)建對(duì)象上只需要傳入這些參數(shù)。在原型對(duì)象用于定義方法和共享屬性。
如下代碼展示了使用原型加構(gòu)造函數(shù)方式創(chuàng)建多個(gè)對(duì)象:
function Person (name, age, address) {
this.name = name
this.age = age
this.address = address
this.eating =
this.running = function () {
console.log(this.name + '在跑步')
}
}
// 將eating方法和running方法加在原型上,就不需要每次創(chuàng)建一個(gè)對(duì)象都去在內(nèi)存中加一遍一樣的方法
Person.prototype.eating = function () {
console.log(this.name + '在吃飯')
}
Person.prototype.running = function () {
console.log(this.name + '在跑步')
}
var p1 = new Person('jam', 20, '北京市')
var p2 = new Person('tom', 14, '上海市')
var p3 = new Person('li', 13, '天津市')
console.log(p1)
// 輸出結(jié)果:
// Person {
// name: 'jam',
// age: 20,
// address: '北京市',
// eating: [Function],
// running: [Function]
// }
p1.eating() // jam在吃飯最后的當(dāng)然是壓軸的呀,這種原型和構(gòu)造函數(shù)方式是目前在ECMAScript中使用得最廣泛、認(rèn)同度最高的一種創(chuàng)建對(duì)象的方法。






