首頁 > web前端 > js教程 > 如何理解javascript的對象

如何理解javascript的對象

醉折花枝作酒筹
發布: 2023-01-07 11:45:01
原創
2408 人瀏覽過

在JS或說在物件導向的程式語言中,物件是一系列屬性和方法的組合。一個屬性包含屬性名稱和屬性值,這個值可以是任意類型的數據,也可以是個函數,這種情況下函數也稱為方法。

如何理解javascript的對象

本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

1.1 什麼是物件?

物件是事物,在現實世界中,一個球,一張桌子,一輛汽車都是物件。

物件是具有可描述特徵的事物,我們可以用某種特定的方式去影響和操作它。

在JS或說在物件導向的程式語言中,物件是一系列屬性和方法的組合。

一個屬性包含屬性名稱和屬性值,這個值可以是任意類型的數據,也可以是個函數,這種情況下函數也稱為方法。

而在JS中,你遇到的所有東西幾乎都是對象,那麼讓我們來了解一下對象的細節。

1.2 物件的特徵?

物件有屬性,也就是物件的特徵,可以透過點符號來存取一個物件的屬性。

objectName.propertyName;

如果把物件比喻成現實中的一個球,那這個球就是一個對象,擁有屬性,有顏色有大小。這些可以這樣表示:

var ball = new Object();
ball.color = “red";
ball.size = 12;
登入後複製

物件還有方法,方法用來定義物件的行為方式。

例如這個球可能有滾動的方法可以計算能滾多遠,有彈跳的方法可以計算跳多高。

可以這樣表示:

ball.roll = function() {
return this.size * laps
}
登入後複製

1.3 存取物件的屬性

前面講過我們可以透過點符號來存取物件的屬性,但如果是這樣的情況,還能透過點符號存取物件的屬性嗎:

var ball = new Object();
ball.color = “red";
ball.size = 12;
var spec = “color”;
ball.spec ??
登入後複製

這裡假設有一個變數spec,我們需要透過這個變數spec來存取物件屬性。

但如果用點符號將會存取ball的spec屬性然後回傳一個undefined,表示這裡直接將spec當做了一個屬性而不是變數。

如果我們想要得到變數的值,來當作物件的屬性應該怎麼做呢?

可以使用方括號標記來訪問,這個標記法在屬性名稱那裡是動態判定的,這樣就可以透過儲存在變數中的字串來存取屬性了:

ball[spec]; // red
登入後複製

1.4 枚舉物件的屬性

另外我們可以透過for in迴圈語句來列舉物件的所有屬性:

var ball = {color: “red”, size: 12, border: 2};
for (var prop in ball) {
console.log(“ball.” + prop + “=“ + obj[prop]);
}
// ball.color = red
// ball.size = 12
// ball.border = 2
// 如果希望继承的属性不显示,那么可以用hasOwnProperty函数来过滤一遍
var bar = {a: 1, b: 2, c: 3};
function Foo() {
this.color = 'red';
}
Foo.prototype = bar;
var obj = new Foo();
for (var prop in obj) {
if (obj.hasOwnProperty(prop)) {
console.log(prop);
}
}
登入後複製

也可以透過Object.keys(obj)的方法來傳回一個屬性名稱集合的陣列:

var obj = {a: “123”, b: “das”, c: “web”};
console.log(Object.keys(obj)); // [“a”,”b”,”c”];
var arr = [“a”, “b”, “c”];
console.log(Object.keys(arr)); // [“0”,”1”,”2”];
登入後複製

【推薦學習:javascript高階教學

以上是如何理解javascript的對象的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板