JavaScript建立物件-js教程-PHP中文網

JavaScript建立物件

不言

發布： 2018-04-10 16:48:50

原創

1421 人瀏覽過

這篇文章給大家分享的內容是關於JavaScript創建對象，有著一定的參考價值，有需要的朋友可以參考一下

呼叫系統的建構子

#創建一個最簡單的方式就是建立一個Object的實例，如下：

    // 1. 调用系统的构造函数
    var person = new Object();

    // 添加属性
    person.name = "小李";
    person.age = 22;
    person.sex = "F";

    // 添加方法
    person.eat = function () {
        console.log("我喜欢吃油炸榴莲.")
    };

    person.play = function () {
        console.log("我喜欢玩电子游戏.")
    };

    person.introduce = function () {
        console.log("我叫" + this.name + ", 今年" + this.age + "岁.");
    };    
    
    person.introduce();        // 输出：我叫小李, 今年22岁.

登入後複製

上面的程式碼建立了一個名為object的對象，並為它增加了三個屬性和三個方法。

物件字面量

但是，雖然Object建構子和物件字面量可以用來建立單一對象，但是這樣建立物件會產生大量的重複程式碼。於是人們開始使用工廠模式。如下：

function createPerson(name, age, sex) {
    var object = new Object();
    person.name = "小李";
    person.age = 22;
    person.sex = "F";
    person.introduce = function () {
        console.log("我叫" + this.name + ", 今年" + this.age + "岁.");
    };
    
    return person;
}

var person0 = createPerson("小苏", "21", "M");
var person1 = createPerson("铁子", "27", "M");

登入後複製

函數createPerson()能夠根據接受的參數來建構一個包含所有資訊的Person物件。可以無數次地呼叫這個函數，而每次它都會傳回一個包含三個屬性和一個方法的物件。工廠模式雖然解決了創建多個類似物件導致的程式碼大量重複的問題，但卻沒有解決物件識別的問題，即如何知道一個物件的類型。隨著JavaScript的發展，又一個新的模式出現了，那就是建構函式模式。

建構函式模式

在ECMAScript中的建構子可以建立特定型別的物件。像是Object物件和Array物件這樣的原生建構函數，在運行的時候回自動出現在執行環境中。此外我們也可以自訂建構函數，從而自訂物件的類型和方法。例如，前面的範例可以用自動以建構函式重寫為以下的程式碼：

function Person(name, age, sex) {
    this.name = name;
    this.age  = age;
    this.sex  = sex;
    
    this.introduce = function () {
        console.log("我叫" + this.name + ", 今年" + this.age + "岁.");
    };
}

var person0 = createPerson("小苏", "21", "M");
var person1 = createPerson("铁子", "27", "M");

登入後複製

在這個範例中，Person()函式取代了createPerson()函式。我們注意到，Person()函數中的程式碼與createPerson()函數中存在以下相同之處：