JavaScript 對象 · W3School Javascript & jQuery 教程

# JavaScript 對象 **JavaScript 中的所有事物都是對象：字符串、數值、數組、函數...** **此外，JavaScript 允許自定義對象。** ## JavaScript 對象 JavaScript 提供多個_內建_對象，比如 String、Date、Array 等等。對象只是帶有_屬性_和_方法_的特殊數據類型。 ## 訪問對象的屬性屬性是與對象相關的值。訪問對象屬性的語法是： ``` _objectName_._propertyName_ ``` 這個例子使用了 String 對象的 length 屬性來獲得字符串的長度： ``` var message="Hello World!"; var x=message.`length`; ``` 在以上代碼執行后，x 的值將是： ``` 12 ``` ## 訪問對象的方法方法是能夠在對象上執行的動作。您可以通過以下語法來調用方法： ``` _objectName_._methodName_() ``` 這個例子使用了 String 對象的 toUpperCase() 方法來將文本轉換為大寫： ``` var message="Hello world!"; var x=message.`toUpperCase()`; ``` 在以上代碼執行后，x 的值將是： ``` HELLO WORLD! ``` ## 創建 JavaScript 對象通過 JavaScript，您能夠定義并創建自己的對象。創建新對象有兩種不同的方法： 1. 定義并創建對象的實例 2. 使用函數來定義對象，然后創建新的對象實例 ## 創建直接的實例這個例子創建了對象的一個新實例，并向其添加了四個屬性： ### 實例 ``` person=new Object(); person.firstname="Bill"; person.lastname="Gates"; person.age=56; person.eyecolor="blue"; ``` 替代語法（使用對象 literals）： ### 實例 ``` person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"}; ``` ## 使用對象構造器本例使用函數來構造對象： ### 實例 ``` function person(firstname,lastname,age,eyecolor) { this.firstname=firstname; this.lastname=lastname; this.age=age; this.eyecolor=eyecolor; } ``` ## 創建 JavaScript 對象實例一旦您有了對象構造器，就可以創建新的對象實例，就像這樣： ``` var myFather=new person("Bill","Gates",56,"blue"); var myMother=new person("Steve","Jobs",48,"green"); ``` ## 把屬性添加到 JavaScript 對象您可以通過為對象賦值，向已有對象添加新屬性：假設 personObj 已存在 - 您可以為其添加這些新屬性：firstname、lastname、age 以及 eyecolor： ``` person.firstname="Bill"; person.lastname="Gates"; person.age=56; person.eyecolor="blue"; x=person.firstname; ``` 在以上代碼執行后，x 的值將是： ``` Bill ``` ## 把方法添加到 JavaScript 對象方法只不過是附加在對象上的函數。在構造器函數內部定義對象的方法： ``` function person(firstname,lastname,age,eyecolor) { this.firstname=firstname; this.lastname=lastname; this.age=age; this.eyecolor=eyecolor; this.changeName=changeName; function changeName(name) { this.lastname=name; } } ``` changeName() 函數 name 的值賦給 person 的 lastname 屬性。現在您可以試一下： ``` myMother.changeName("Ballmer"); ``` ## JavaScript 類 JavaScript 是面向對象的語言，但 JavaScript 不使用類。在 JavaScript 中，不會創建類，也不會通過類來創建對象（就像在其他面向對象的語言中那樣）。 JavaScript 基于 prototype，而不是基于類的。 ## JavaScript for...in 循環 JavaScript for...in 語句循環遍歷對象的屬性。 ### 語法 ``` for (對象中的變量) { 要執行的代碼 } ``` 注釋：for...in 循環中的代碼塊將針對每個屬性執行一次。 ### 實例循環遍歷對象的屬性： ``` var person={fname:"Bill",lname:"Gates",age:56}; for (x in person) { txt=txt + person[x]; } ``` ## 課外書如需更多有關 _JavaScript 對象_的知識，請閱讀 JavaScript 高級教程中的相關內容： [ECMAScript 面向對象技術](/js/pro_js_object_oriented.asp "ECMAScript 面向對象技術") 本節簡要介紹了面向對象技術的術語、面向對象語言的要求以及對象的構成。 [ECMAScript 對象應用](/js/pro_js_object_working_with.asp "ECMAScript 對象應用") 本節講解了如何聲明和實例化對象，如何引用和廢除對象，以及綁定的概念。 [ECMAScript 對象類型](/js/pro_js_object_types.asp "ECMAScript 對象類型") 本節介紹了 ECMAScript 的三種類型：本地對象、內置對象和宿主對象，并提供了指向相關參考手冊的鏈接。 [ECMAScript 對象作用域](/js/pro_js_object_scope.asp "ECMAScript 對象作用域") 本節講解了 ECMAScript 作用域以及 this 關鍵字。 [ECMAScript 定義類或對象](/js/pro_js_object_defining.asp "ECMAScript 定義類或對象") 本節詳細講解了創建 ECMAScript 對象或類的各種方式。 [ECMAScript 修改對象](/js/pro_js_object_modifying.asp "ECMAScript 修改對象") 本節講解了如何通過創建新方法或重定義已有方法來修改對象。