JavaScript建立物件

這篇文章給大家分享的內容是關於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()函數中存在以下相同之處：

• 沒有明確地建立物件；

• #直接將屬性和方法賦給了this物件；

• 沒有return語句。

此外，也應該注意到函數名稱開頭使用的是大寫字母P。按照慣例，建構子總是應該以一個大寫字母開頭，而非建構子應該以一個小寫字母開頭。
要建立Person的新實例，必須使用new操作符。這種操作方式呼叫建構函式其實會經歷4個過程：

1. 建立一個新物件；

2. ##將建構子的作用域賦給新物件（因此this就指向了這個新物件）；

3. 執行建構函式中的程式碼；

4. 傳回這個新對象。

相關推薦：

node.js建立本機伺服器詳解

##幾種JS創建物件的方式分享

three.js建立場景實例詳解

#

以上是JavaScript建立物件的詳細內容。更多資訊請關注PHP中文網其他相關文章！