亚洲视频二区_亚洲欧洲日本天天堂在线观看_日韩一区二区在线观看_中文字幕不卡一区

公告:魔扣目錄網(wǎng)為廣大站長提供免費(fèi)收錄網(wǎng)站服務(wù),提交前請做好本站友鏈:【 網(wǎng)站目錄:http://www.430618.com 】, 免友鏈快審服務(wù)(50元/站),

點(diǎn)擊這里在線咨詢客服
新站提交
  • 網(wǎng)站:51998
  • 待審:31
  • 小程序:12
  • 文章:1030137
  • 會(huì)員:747

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


JavaScript創(chuàng)建多個(gè)對(duì)象方法總結(jié)


在開發(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ì)象的方法。


分享到:
標(biāo)簽:JavaScript JavaScript多個(gè)對(duì)象 JavaScript方法
用戶無頭像

網(wǎng)友整理

注冊時(shí)間:

網(wǎng)站:5 個(gè)   小程序:0 個(gè)  文章:12 篇

  • 51998

    網(wǎng)站

  • 12

    小程序

  • 1030137

    文章

  • 747

    會(huì)員

趕快注冊賬號(hào),推廣您的網(wǎng)站吧!
最新入駐小程序

數(shù)獨(dú)大挑戰(zhàn)2018-06-03

數(shù)獨(dú)一種數(shù)學(xué)游戲,玩家需要根據(jù)9

答題星2018-06-03

您可以通過答題星輕松地創(chuàng)建試卷

全階人生考試2018-06-03

各種考試題,題庫,初中,高中,大學(xué)四六

運(yùn)動(dòng)步數(shù)有氧達(dá)人2018-06-03

記錄運(yùn)動(dòng)步數(shù),積累氧氣值。還可偷

每日養(yǎng)生app2018-06-03

每日養(yǎng)生,天天健康

體育訓(xùn)練成績評(píng)定2018-06-03

通用課目體育訓(xùn)練成績評(píng)定