JS建立物件（3種方式）

在 JavaScript 中建立物件的方式有 3 種，簡單介紹如下。

構造物件

使用 new 運算子呼叫建構函式，可以構造一個範例物件。具體用法如下：

var objectName = new functionName(args);

引數說明如下：

• objectName：返回的範例物件。
• functionName：建構函式，與普通函數基本相同，但是不需要 return 返回值，返回範例物件，在函數內可以使用 this 預先存取。
• args：範例物件初始化設定參數列。

範例

下面範例使用不同型別的建構函式定義各種範例。

var o = new Object();  //定義一個空物件
var a = new Array();  //定義一個空陣列
var f = new Function();  //定義一個空函數

物件直接量

使用直接量可以快速建立物件，也是最高效、最簡便的方法。具體用法如下：

var objectName = {
    屬性名1 : 屬性值1,
    屬性名2 : 屬性值2,
    ...
    屬性名n : 屬性值n
};

在物件直接量中，屬性名與屬性值之間通過冒號進行分隔，屬性值可以是任意型別的資料，屬性名可以是 JavaScript 識別符號，或者是字串型表示式。屬性於屬性之間通過逗號進行分隔，最後一個屬性末尾不需要逗號。

範例1

下面程式碼使用物件直接量定義兩個物件。

var o = {  //物件直接量
    a : 1,  //定義屬性
    b : true  //定義屬性
}
var o1 = {  //物件直接量
    "a" : 1,  //定義屬性
    "b" : true  //定義屬性
}

範例2

屬性值可以是任意型別的值。如果屬性值是函數，則該屬性也稱為方法。

var o = {  //物件直接量
    a : function () {  //定義方法
        return 1;
    }
}

範例3

如果屬性值是物件，可以設計巢狀結構的物件。

var o = {  //物件直接量
    a : {  //巢狀物件
        b : 1
    }
}

範例4

如果不包含任何屬性，則可以定義一個空物件。

var o = {}  //定義一個空物件直接量

使用 Object.create

Object.create 是 ECMAScript 5 新增的一個靜態方法，用來建立一個範例物件。該方法可以指定物件的原型和物件特性。具體用法如下：

Object.create(prototype, descriptors)

引數說明如下：

• prototype：必須引數，指定原型物件，可以為 null。
• descriptors：可選引數，包含一個或多個屬性描述符的 JavaScript 物件。屬性描述符包含資料特性和存取器特性，其中資料特性說明如下。
• value：指定屬性值。
• writable：預設為 false，設定屬性值是否可寫。
• enumerable：預設為 false，設定屬性是否可列舉（for/in）。
• configurable：預設為 false，設定是否可修改屬性特性和刪除屬性。
   

存取器特性包含兩個方法，簡單說明如下：

• set()：設定屬性值。
• get()：返回屬性值。

範例1

下面範例使用 Object.create定義一個物件，繼承 null，包含兩個可列舉的屬性 size 和 shape，屬性值分別為 "large" 和 "round"。

var newObj = Object.create (null, {
    size : {  //屬性名
        value : "large",  //屬性值
        enumerable : true  //可以列舉
    },
    shape : {  //屬性名
        value : "round",  //屬性值
        enumerable : true  //可以列舉
    }
});
console.log(newObj.size);  //large
console.log(newObj.shape);  //round
console.log(Object.getPrototypeOf(newObj));  //null

範例2

下面範例使用 Object.create 定義一個與物件直接量具有相同原型的物件。

var obj = Object.create(Object.prototype, {  //繼承Obj.prototype原型物件
    x : {
        value : undefined,  //屬性值
        writable : true,  //可寫
        configurable : true,  //可以設定
        enumerable : true  //可以列舉
    }
});
console.log("obj.prototype = " + Object.getPrototypeOf(obj));  //"obj.prototype =[object, Object]"

Object.getPrototypeOf() 函數可獲取原始物件的原型。如果要獲取物件的屬性描述符，可以使用 Object.getOwnPropertyDescriptor() 函數。

範例3

下面範例定義一個物件，使用存取器屬性 b 來讀寫資料屬性 a。

var obj = Object.create(Object.prototype, {
    a : {  //資料屬性a
        writable : true,
        value : "a"
    },
    b : {  //存取器屬性b
        get : function () {
            return this.a;
        },
        set : function (value) {
            this.a = value;
        },
    }
});
console.log(obj.a);  //"a"
console.log(obj.b);  //"a"
obj.b = 20;
console.log(obj.b);  //20