javascript中的對象文字如何工作？

Question

在考慮以下代碼示例（來自Mozilla的開發人員網站）時，我在理解javascript中對象文字的語法時遇到了一些麻煩：

var car = { manyCars: {a: "Saab", "b": "Jeep"}, 7: "Mazda" };

console.log(car.manyCars.b); // Jeep
console.log(car[7]); // Mazda

我目前對javascript對象文字的理解是：如果給定鍵，值對，並且鍵為數據類型，則它的工作方式類似於python字典，使car [key]返回您設置為鍵的值。 如果您僅將密鑰作為文本提供，它將在“ car”中定義一個變量，該變量設置為您與該密鑰關聯的值。 但是，在上面的代碼中， "b"是一個字符串，但是可以將car.manyCars.b當作一個變量設置為"Jeep" ，並且car.manyCars["b"]是有效的語法，返回"Jeep" 。

我想知道是否有人可以對我在聲明對象文字時實際發生的情況給出清晰的解釋，因為顯然我目前的理解還不完整。

Answer 1

在JavaScript中，對象文字表示法中的鍵無論是否用引號括起來都被視為字符串。 因此，與此：

var car = { manyCars : {a: "Saab", "b": "Jeep"}, 7: "Mazda" };

如果您這樣做，請執行以下操作：

for (var k in car) { console.log("key: " + k + " (type: " + typeof(k) + ")"); }

輸出將是：

鍵：7（類型：字符串）
鍵：manyCars（類型：字符串）

注意（顯然）數字鍵7也是一個string 。 您甚至可以將JavaScript關鍵字用作對象文字中的鍵。

請注意，通過鍵訪問值時，規則更加嚴格。 例如，當鍵是保留字時，必須使用下標符號和引號。 同樣，對象文字中的裸鍵必須（如果不是數字文字）必須是有效的JavaScript標識符名稱，因此它不能包含空格，逗號或JavaScript運算符（ + ， =等）。

Answer 2

在JavaScript對象中，文字由鍵值對組成。 JavaScript中的鍵始終是字符串，而值可以是任何數據類型。

JavaScript提供了用於定義鍵的語法糖。 例如，與字符串文字不同，您不需要引用鍵。 因此，以下兩個示例是等效的：

{ x: 0 }   // example 1
{ "x": 0 } // example 2

但是，此語法糖僅適用於它們之間沒有任何空格（即空格，制表符，換行符等）的標識符。 例如，以下在JavaScript中無效：

{ a property: 0 } // whitespace not allowed in identifiers

但是，您可以通過引用標識符來解決此限制：

{ "a property": 0 } // valid

您還可以使用布爾值（ true或false ），數字文字以及undefined和null作為鍵。 但是請記住，它們被強制為字符串。 因此，您可以執行以下操作：

var o = {
    undefined: 1,
    null: 2,
    true: 3,
    false: 4,
    0: 5
};

然后，您可以通過以下方式訪問它們：

alert(o.undefined); // 1
alert(o.null);      // 2
alert(o.true);      // 3
alert(o.false);     // 4
alert(o[0]);        // 5

最后的聲明很重要。 數字文字本身不能歸類為有效標識符。 因此，您需要使用數組括號符號（ [] ）而不是點符號（ . ）來訪問它。

由於JavaScript中的所有鍵都是字符串，因此您甚至可以：

alert(o["undefined"]); // 1
alert(o["null"]);      // 2
alert(o["true"]);      // 3
alert(o["false"]);     // 4
alert(o["0"]);         // 5

但是，不能將對象，數組或函數用作鍵。 例如，以下內容無效：

{ {1: 2}: 3 }            // objects can't be used as keys
{ [1]: 2 }               // arrays can't be used as keys
{ function () {}: true } // functions can't be used as keys

這就是有關對象文字的所有信息。

Answer 3

本質上，JavaScript中的對象文字與字典非常相似，但具有Java或PHP中的對象功能。 這些對象可以具有在函數中定義的功能，在屬性中定義的功能，或在兩者中定義的功能。 您可以根據引用的鍵使用引號或點語法。 有些可能帶有特殊字符，那么您需要使用引號，如果沒有特殊字符，請使用點號。 兩者都是正確的。

這是一個有用的資源，用於比較和對比創建對象文字和通過構造函數創建對象之間的區別。

http://net.tutsplus.com/tutorials/javascript-ajax/the-basics-of-object-oriented-javascript/

這是關於對象字面量使用的另一個更深入的探討

http://javascript.info/tutorial/objects