JavaScript作為一種動態語言,對于對象的屬性是非常靈活的,我們可以在任何時候添加、修改、刪除一個對象的屬性,這就是動態對象屬性。
舉個例子,我們來定義一個人的對象:
在定義該對象后,我們可以隨時添加一個新的屬性,例如他的職業:var person = { name: "John", age: 30 };
這里我們沒有事先定義這個`job`屬性,但是因為JavaScript是具有動態性的語言,我們可以在任何時候添加屬性。 在 JavaScript 中, 對象屬性分為兩種類型:可枚舉屬性和不可枚舉屬性。默認情況下,所有的屬性都是可枚舉的。 1.添加屬性 對象屬性的動態性表現在我們可以在任何時候給一個對象添加新的屬性。 以下是一個通過動態添加屬性來改變局面的例子。假設有一個頁面, 你要把頁面所有 H1 標記加粗:person.job = "Engineer";
var headings = document.getElementsByTagName('h1'); for (var i=0; i這段代碼首先通過 `getElementsByTagName()` 函數獲取到所有的 標簽, 然后通過循環遍歷每一個標簽, 并且設置其樣式為加粗。 假設后面又增加了一些H1標簽,那么我們也可以繼續添加:
var newheading = document.createElement('h1'); newheading.innerHTML = 'This is a new heading'; newheading.style.fontWeight = 'bold'; document.body.appendChild(newheading);通過 `createElement()` 函數創建一個新的標簽,設置其樣式為加粗,然后添加到文檔中。這里我們發現,我們可以隨時給他添加新的屬性與屬性值。 2.修改屬性 另一個對象屬性的動態性表現在我們可以在任何時候更改一個對象的屬性。對于現有的可枚舉屬性,我們可以通過直接給它賦值來更改屬性的值。 讓我們再來看上面的`person`例子,假設他換工作了,我們需要修改他的`job`屬性:
現在,`person`的`job`屬性不再是`Engineer`,變為了`Doctor`。 3.刪除屬性 對象屬性的動態性還表現在我們可以在任何時候刪除一個對象的屬性。 我們可以通過delete命令刪除一個對象的屬性: 庫存跟蹤程序的一個例子,我們添加了一些商品到我們的庫存中:person.job = "Doctor";
var inventory = { apples: 0, oranges: 0 };現在的庫存是空的。 現在我們買了 5 個蘋果和 2 個橙子:inventory.apples = 5; inventory.oranges = 2;現在庫存的期望為:inventory = { apples: 5, oranges: 2 };但現在我們不再出售橙子,我們需要通過代碼將這個屬性從對象unset:delete inventory.oranges;現在的庫存為:inventory = { apples: 5 }以上就是對象屬性的動態性的表現。在我們需要在代碼中動態地管理數據時, 這是一個非常重要的特性。也正因為這一點,JavaScript是一種非常靈活的編程語言。
下一篇CSS中表格標記符