首頁 web前端 js教程 JavaScript進階系列—物件使用與屬性

JavaScript進階系列—物件使用與屬性

Feb 07, 2017 pm 05:22 PM

  • 物件作為資料型別

  • 存取屬性

  • 刪除屬性

  • 屬性名稱的語法

  • 刪除屬性

屬性名稱的語法

屬性

除了兩個例外 null 和 undefined 。

false.toString(); // 'false'
[1, 2, 3].toString(); // '1,2,3'

function Foo(){}
Foo.bar = 1;
Foo.bar; // 1
登入後複製

一個常見的誤解是數字的字面值(literal)不能當作物件。這是因為 JavaScript 解析器的一個錯誤, 它試圖將點運算子解析為浮點數數位面值的一部分。

2.toString(); // 出错:SyntaxError
登入後複製

有很多變通方法可以讓數字的字面值看起來像物件。

2..toString(); // 第二个点号可以正常解析
2 .toString(); // 注意点号前面的空格
(2).toString(); // 2先被计
登入後複製

物件作為資料型別

JavaScript 的物件可以當作雜湊表使用,主要用來保存命名的鍵與值的對應關係。

使用物件的字面語法 - {} - 可以建立一個簡單物件。這個新建立的物件從Object.prototype 繼承下面,沒有任何自訂屬性。

var foo = {}; // 一个空对象

// 一个新对象,拥有一个值为12的自定义属性'test'
var bar = {test: 12};
登入後複製

存取屬性

有兩種方式來存取物件的屬性,點操作符或中括號操作符。

var foo = {name: 'kitten'}
foo.name; // kitten
foo['name']; // kitten

var get = 'name';
foo[get]; // kitten

foo.1234; // SyntaxError
foo['1234']; // works
登入後複製
    兩種語法是等價的,但是中括號運算子在下面兩種情況下依然有效
  • 動態設定屬性
  • 屬性名譯者不是有效的變數屬性(譯者:例如屬性名包含空格,或屬性名稱是JS 的關鍵字)

刪除屬性

刪除屬性的唯一方法是使用 delete 操作符;設定屬性為 undefined 或 null 並不能真正的刪除屬性,而僅是移轉除了屬性和值的關聯。

var obj = {
    bar: 1,
    foo: 2,
    baz: 3
};
obj.bar = undefined;
obj.foo = null;
delete obj.baz;

for(var i in obj) {
    if (obj.hasOwnProperty(i)) {
        console.log(i, '' + obj[i]);
    }
}
登入後複製

上面的輸出結果有 bar undefined 和 foo null - 只有 baz 真正的刪除了,所以從輸出結果中消失。

屬性名的語法

var test = {
    'case': 'I am a keyword so I must be notated as a string',
    delete: 'I am a keyword too so me' // 出错:SyntaxError
};
登入後複製

物件的屬性名稱可以使用字串或普通字元宣告。但由於 JavaScript 解析器的另一個錯誤設計, 上面的第二種宣告方式在 ECMAScript 5 之前會拋出SyntaxError 的錯誤。

這個錯誤的原因是 delete 是 JavaScript 語言的一個關鍵字;因此為了在更低版本的 JavaScript 引擎下也能正常運行, 必須使用字串字面值宣告方式。

以上就是JavaScript進階系列—物件使用與屬性的內容,更多相關內容請關注PHP中文網(www.php.cn)!

🎜🎜
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何使用WebSocket和JavaScript實現線上語音辨識系統 如何使用WebSocket和JavaScript實現線上語音辨識系統 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript實現線上語音辨識系統

WebSocket與JavaScript:實現即時監控系統的關鍵技術 WebSocket與JavaScript:實現即時監控系統的關鍵技術 Dec 17, 2023 pm 05:30 PM

WebSocket與JavaScript:實現即時監控系統的關鍵技術

如何使用WebSocket和JavaScript實現線上預約系統 如何使用WebSocket和JavaScript實現線上預約系統 Dec 17, 2023 am 09:39 AM

如何使用WebSocket和JavaScript實現線上預約系統

如何利用JavaScript和WebSocket實現即時線上點餐系統 如何利用JavaScript和WebSocket實現即時線上點餐系統 Dec 17, 2023 pm 12:09 PM

如何利用JavaScript和WebSocket實現即時線上點餐系統

簡易JavaScript教學:取得HTTP狀態碼的方法 簡易JavaScript教學:取得HTTP狀態碼的方法 Jan 05, 2024 pm 06:08 PM

簡易JavaScript教學:取得HTTP狀態碼的方法

JavaScript與WebSocket:打造高效率的即時天氣預報系統 JavaScript與WebSocket:打造高效率的即時天氣預報系統 Dec 17, 2023 pm 05:13 PM

JavaScript與WebSocket:打造高效率的即時天氣預報系統

如何在JavaScript中取得HTTP狀態碼的簡單方法 如何在JavaScript中取得HTTP狀態碼的簡單方法 Jan 05, 2024 pm 01:37 PM

如何在JavaScript中取得HTTP狀態碼的簡單方法

javascript如何使用insertBefore javascript如何使用insertBefore Nov 24, 2023 am 11:56 AM

javascript如何使用insertBefore

See all articles