物件

物件是一種獨立資料類型,方式與每個原始都是資料類型一樣,但有一項重大差異:與原始物件不同,物件是「可變動」。物件可包含與 ID 相關的資料 (例如變數),但無論內含何種資料,物件都會保留其 object 資料類型。

除了原始值以外,所有 JavaScript 值都是物件,但由於原型繼承的關係,即使原始常值具有類似物件的行為,通常還是有人說 JavaScript 是由物件組成。

物件常值是一組大括號,圍繞著零個或多個鍵/值組合 (稱為「屬性」),其中可包含任何 JavaScript 值。

{
    "myProperty" : true
}

屬性「金鑰」可以是任何符號字串。如同將 ID 指派給變數時,做為屬性鍵使用的字串應具有可預測性,且具有描述性:

let carAttributes = {
    "color" : "red"
};

carAttributes
> Object { color: "red" }

屬性鍵需要單一 (') 或雙引號 (") 字串常值,而非範本常值

let carAttributes = {
    `keyString` : false
};
> Uncaught SyntaxError: expected property name, got template literal

屬性值可以是任何資料類型。物件的屬性本身可包含物件,其中有專屬屬性:

let myObject = {
    'key' : {
        'subkey' : true,
        'othersubkey' : false
    }
};

myObject;
> Object { key: Object { subkey: true, othersubkey: false } }

如果屬性的值是函式,則該屬性稱為「方法」。

const myObject = {
    "myProperty" : true,
    myMethod() {
        console.log( "This is a method." );
    }
}

myObject.myProperty;
> true

myObject.myMethod();
> "This is a method."

您也可以使用 new 關鍵字建立物件:

let myObject = new Object();

在上述範例中,新建立的物件常值已指派給變數。這並非必要步驟,因為如同任何其他資料類型,您可以使用沒有 ID 的物件,只要預期物件就會使用。不過,由於兩個共用大括號語法 ({}),物件常值在任何情況下都需要使用括號,因為這樣可能會對區塊陳述式產生混淆。

{ "value" : 2 }
> Uncaught SyntaxError: unexpected token: ':'

({ "value" : 2 })
> Object { value: 2 }

let valObj = { "value" : 2 };

valObj;
> Object { value: 2 }

與基本功能不同,使用 new Object() 建立物件及建立物件常值建立的物件結果並沒有實質差異,因為不論是哪一種情況,都會是含有繼承自 Object 原型屬性的物件。不過,這兩種語法之間有一項實質差異。

new 關鍵字必須定義稍後要填入資料的空白物件:

let myObject = new Object();

myObject.booleanValue = true;
myObject.stringValue = "My string.";

物件常值可以在建立時填入資料:

let myObject = {
    'booleanValue' : true,
    'stringValue' : "My string."
};

雖然使用 new Object() 的應用方式很少,但原始資料值可以轉變成其各自類型的物件,例如使用 new 關鍵字和建構函式函式傳回的物件。舉例來說,以下函式在功能上等同於 new Number( 10 )

let myObject = new Object( 10 );

myObject;
> Number { 10 }

nullundefined 值會產生空白物件,功能會與叫用 new Object() 的方式相同,且未提供引數。

將物件常值傳遞至 new Object() 做為引數,會在不變更物件常值的情況下傳遞物件常值:

let myObject = new Object( { myValue : 10 } );

myObject;
> Object { myValue: 10 }

與使用建構函式處理原始值一樣,將物件建構函式用於物件,很少有使用物件常值標記法的好處。即使已建立可以稍後填入值的空白物件,開發人員為了簡單起見,往往傾向使用物件常值標記法。

隨堂測驗

您可以使用何種標記法設定物件的屬性?

點號
括號標記法
經期標記法
行號標記法

以下何者是取得 myProp 值的正確語法

myObj["myProp"];
myObj{"myProp"};
myObj("myProp");