JavaScript 的 物件 ( Object ) 亂塞一通的學校置物櫃


如果說陣列是適合放同類型東西的小櫃子,如屬性相似、有順序性的資料,那我覺得物件(Object)就像是可以塞很多東西的學校置物櫃(別問我,為什麼我的學校置物櫃亂七八糟的)。

物件( Object )本身是由 {名稱 (key) / 值 (value)}所組成

1.名稱(key)避免使用數字開頭帶有空格的字串帶有特殊字元
2.值(value)可以是任何東西,如:純值函式陣列物件等。


物件宣告

聽說有兩種宣告方式:

Object Constructor (物件建構式)
var MyObject = new Object(); 用 new 關鍵字加上 Object()來宣告一個物件,但似乎不太常用。

Object Literal (物件實字)
var MyObject = {}; 比較常用的語法,也就是用 {} 來宣告一個物件。


物件的使用

看到大家的筆記幾乎都是聯絡人,或學校學生資料,但我決定要用不一樣的,我要用我沒有的東西,所以我要用物件做一份 男友清單 沒錯,我就是這麼不營養。

var Vergil = {
    name:'Vergil',
    height:190,
    face:'handsome',
    Personality:'cold',
    family:{
        name:Dante,
        height:187,
        face:'handsome'
    }
    score:80
}
console.log(Vergil);                           //印出這個男生的資料

>{name: "Vergil", height: 190, face: "handsome", Personality: "cold", family: Object, score: 80}

console.log(Vergil.height);                   //一般表達方式
>190

console.log(Vergil['height']);               //如同陣列般的表達方式,裡面可以放變數喔!
>190

console.log(Vergil.family.name);             //物件裡面的物件,可以這樣取資料
>Dante

假設有一天,我腳踏多條船了( 哪泥! ),那男友清單的管理該怎毛辦?沒關係,我們來使用看看陣列,看能不能幫我管理多筆男友清單的資料。

var BoyfriendList = [];
var Vergil = {
    Name:'Vergil',
    height:190,
    face:'handsome',
    Personality:'cold'
}

var Zack = {
    Name:'Zack',
    height:185,
    face:'handsome',
    Personality:'Nice'
}

var Cloud = {
    Name:'Cloud',
    height:180,
    face:'soso',
    Personality:'blue'
}
BoyfriendList.push(Vergil,Zack,Cloud)

console.log(BoyfriendList[0])
>{ Name: "Vergil", height: 190, face: "handsome", Personality: "cold" }

參考資料:
Lidemy 鋰學院-Huli老師的課程
鐵人賽:JavaScript 就是一堆物件的概念
JavaScript Object (物件)
你懂 JavaScript 嗎?#17 物件(Object)
JavaScript —陣列 Array 與 物件 object

#object #物件
不小心,參加了 Lidemy 第四期 程式導師計畫! 入門到放棄,又從放棄回到入門,一顆小種子生長記事,一邊寫筆記、一邊看看這顆種子究竟會長出甚麼鬼,可能會開花、可能會變成樹、也可能長成仙人掌, 也可能還沒長大就枯萎了,JavaScript學習筆記。 我最喜歡工程師了!






Related Posts

[JavaScript] 操控 DOM 元素

[JavaScript] 操控 DOM 元素

CH2. 在執行時期產生網頁

CH2. 在執行時期產生網頁

Twitch API壞掉惹,害我debug 超久QQ

Twitch API壞掉惹,害我debug 超久QQ



Sponsored



Comments