JavaScript 物件

JavaScript 物件是擁有屬性和方法的資料。


真實生活中的物件,屬性和方法

真實生活中,一輛汽車是一個物件。

物件有它的屬性,如重量和顏色等,方法有啟動停止等:

物件 屬性 方法

car.name = Fiat

car.model = 500

car.weight = 850kg

car.color = white

car.start()

car.drive()

car.brake()

car.stop()

所有汽車都有這些屬性,但是每款車的屬性都不盡相同。

所有汽車都擁有這些方法,但是它們被執行的時間都不盡相同。


JavaScript 物件

在 JavaScript中,幾乎所有的事物都是物件。

Note 在 JavaScript 中,物件是非常重要的,當你理解了物件,就可以瞭解 JavaScript 。

你已經學習了 JavaScript 變數的賦值。

以下程式碼為變數 car 設定值為 "Fiat" :

var car = "Fiat";

物件也是一個變數,但物件可以包含多個值(多個變數),每個值以 name:value 對呈現。

var car = {name:"Fiat", model:500, color:"white"};

在以上例項中,3 個值 ("Fiat", 500, "white") 賦予變數 car。

Note JavaScript 物件是變數的容器。


物件定義

你可以使用字元來定義和建立 JavaScript 物件:

例項

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

嘗試一下 ?

定義 JavaScript 物件可以跨越多行,空格跟換行不是必須的:

例項

var person = {
    firstName:"John",
    lastName:"Doe",
    age:50,
    eyeColor:"blue"
};

嘗試一下 ?


物件屬性

可以說 "JavaScript 物件是變數的容器"。

但是,我們通常認為 "JavaScript 物件是鍵值對的容器"。

鍵值對通常寫法為 name : value (鍵與值以冒號分割)。

鍵值對在 JavaScript 物件通常稱為 物件屬性

Note JavaScript 物件是屬性變數的容器。

物件鍵值對的寫法類似於:

  • PHP 中的關聯陣列
  • Python 中的字典
  • C 語言中的雜湊表
  • Java 中的雜湊對映
  • Ruby 和 Perl 中的雜湊表

訪問物件屬性

你可以通過兩種方式訪問物件屬性:

例項 1

person.lastName;

嘗試一下 ?

例項 2

person["lastName"];

嘗試一下 ?


物件方法

物件的方法定義了一個函式,並作為物件的屬性儲存。

物件方法通過新增 () 呼叫 (作為一個函式)。

該例項訪問了 person 物件的 fullName() 方法:

例項

name = person.fullName();

嘗試一下 ?

如果你要訪問 person 物件的 fullName 屬性,它將作為一個定義函式的字串返回:

例項

name = person.fullName;

嘗試一下 ?

 

Note JavaScript 物件是屬性和方法的容器。

在隨後的教程中你將學習到更多關於函式,屬性和方法的知識。


訪問物件方法

你可以使用以下語法建立物件方法:

methodName : function() {
    // 程式碼 
}

你可以使用以下語法訪問物件方法:

例項

objectName.methodName()

嘗試一下 ?

通常 fullName() 是作為 person 物件的一個方法, fullName 是作為一個屬性。

如果使用 fullName 屬性,不新增 (), 它會返回函式的定義:

例項

objectName.methodName

嘗試一下 ?

有多種方式可以建立,使用和修改 JavaScript 物件。

同樣也有多種方式用來建立,使用和修改屬性和方法。

Note 在隨後的教程中,你將學習到更多關於物件的知識。


更多例項

建立 JavaScript 物件 I

建立 JavaScript 物件 II

訪問物件屬性 I

訪問物件屬性 II

函式屬性作為一個方法訪問

函式屬性作為一個屬性訪問