JavaScript 對象字面量(object literal)

什麼是字面量

用來爲變量賦值時的常數量

對象字面量

對象字面值是封閉在花括號對({})中的一個對象的零個或多個”屬性名:值”列表。

var person={ 
    name:"Jack", 
    age:10,
    5:true  
};
  • 在這個例子中,左邊的花括號({)表示對象字面量的開始,因爲它出現在了表達式上下文(expression context)中。
  • JavaScript 中的表達式上下文(expression context)指的是能夠返回一個值(表達式)。
  • 賦值操作符(=)表示後面是一個值,所以左花括號在這裏表示一個表達式的開始。
  • 同樣的花括號,如果出現在一個語句上下文(statement context)中,例如跟在 if語句條件的後面,則表示一個語句塊的開始。
  • 例子中定義了name屬性,之後是一個冒號,再後面是這個屬性的值(name:"Jack")。在對象字面量中,使用逗號來分隔不同的屬性,因此”Jack”後面是一個逗號。但是age屬性的值 10 的後面不能添加逗號,因爲 age 是這個對象的最後一個屬性。在最後一個屬性後面添加逗號,會在 IE7及更早版本和Opera 中導致錯誤。 不要忘記結束大括號右邊的(

對象字面量的值可以是任何數據類型包括數組字面量,函數,嵌套的對象字面量

var Swapper = {
    // 數組字面量(用逗號分隔,所有都要加引號)
    images: ["smile.gif", "grim.gif", "frown.gif", "bomb.gif"],
    pos: { //嵌套對象字面量
        x: 40,
        y: 300
    },
    onSwap: function() { //函數
    }
};
  • 如果有任何的語法規則被打破,如缺少逗號或冒號或大括號,將會觸發JavaScript錯誤。
  • 瀏覽器的錯誤信息在指出對象字面量語法錯誤的位置一般有幫助,但他們不一定會在指出錯誤的性質完全準確。

在使用對象字面量時,屬性名也可以用字符串

var person={
    "name":"Jack",
    "age":29,
    5:true
};

  • 上述例子會創建一個對象,包含三個屬性,但這裏的數值屬性名會自動轉換爲字符串。
  • 在通過對象字面量定義對象時,實際上不會調用Object構造函數(Firefox 2及更早版本會調用Object構造函數;但Firefox3之後就不會了)
  • 這是因爲字面量法創建對象強調該對象僅是一個可變的hash映射,而不是從對象中提取的屬性或方法。
    創建對象的兩種方法:
    使用字面量方法創建對象:var student = {name: "張三"};
    使用內置構造函數創建對象:var student = new Object(); student.name = "張三"
    應該儘量使用字面量發創建對象,其顯著優點在於它只需要輸入更少的字符,除此之外,還有幾點原因:選擇字面量法創建對象強調該對象僅是一個可變的hash映射,而不是從對象中提取的屬性或方法。
    與使用Object構造函數相比,使用字面量好處在於它並沒有作用域解析。因爲可能當以同樣的名字創建一個局部函數,解釋器需要從棧中調用Object(0的位置開始一直向上查詢作用域鏈,直到發現全局Object構造函數。)
    構造函數Object僅接受一個參數,並且還依賴傳遞的值,該Object()可能會委派另一個內置函數來創建對象,並且返回了一個並非期望的不同對象。(還不確定這句話是否是對的,如果不對希望廣大網友幫忙改正)如將數字、字符串、布爾值當做參數傳遞給Object構造函數,其結果是獲得了以不同構造函數所創建的對象,例如:
    var oschina = new Object(1); ochina.constructor
    ochina.constructorNumber;傳遞的值是動態的,直到運行時才確定其類型,這種行爲會導致意想不到的結果。
  • 雖然可以使用前面介紹的任何一種方法來定義對象,但開發人員更青睞對象字面量語法,因爲這種語法要求的代碼量少,而且能夠給人封裝數據的感覺。實際上,對象字面量也是向函數傳遞大量可選參數的首選方式。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章