iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 24
0

這天草莓雙眼出現好大的黑眼圈。

img

熊熊晚到了一些,看到沒睡飽的草莓嚇了一跳。

「哇草莓!你的黑眼圈怎麼又這麼深啊?」熊熊問。

「我昨天腦袋又出現奇怪的問題所以沒睡好,一直數羊數到天亮。」草莓無精打采地說。

「是什麼問題呀?」

img

「我想說,就算是羊應該也有名字和年齡吧,總是要幫他們取綽號這樣下次看到它們才認得出來呀~」草莓說。

「...」

「然後我拿昨天學過的陣列去套用,發現越想越奇怪,雖然陣列裡面可以放各種不同類型的內容,但是如果要表示同一隻羊的話就好像沒辦法。」草莓苦惱地說。

「喔~原來是這樣」熊熊說。

img

「草莓你說的問題的確僅僅使用陣列是不夠的,你需要了解一個叫做物件 (Object) 的新概念!」熊熊說。

「喔喔!是新東西嗎!我想學!」草莓整隻恐龍都振奮起來了。


「來~這是物件的基本寫法,我們拿羊咩咩當作舉例試試。」

var myGoat = [
  {
    name: "味愧羊",
    age: 6,
    color: "白色"
  }
];

「喔喔!看起來原本的陣列裡面多了一對括號耶!」

「沒錯~物件的特性就是會有一組又一組的資料組成,冒號前面的叫做 key,後面的叫做 value,一定要一對才能正確顯示喔!」


「原來物件也可以塞進陣列呀?」

「陣列什麼都能塞,不管是數字,字串,還是陣列都可以喔!」

「所以第二隻羊的話我就可以這樣寫對嗎?」草莓邊寫邊問。

var myGoat = [
  {
    name: "味愧羊",
    age: 6,
    color: "白色"
  },
  {
    name: "太平羊",
    age: 12,
    color: "黑色"
  }
];

「是的,不過草莓你的羊名字都好奇怪呀 ...」


「熊熊我再問個問題~」

「你說吧!」

「那如果我想要拿到第一隻羊咩咩的名字的話,應該怎麼要怎麼寫呢?」

「這個寫法其實跟陣列蠻類似的呦!草莓你可以先試著寫寫看嗎?」

「好我試試看~」

var myGoat = [
  {
    name: "味愧羊",
    age: 6,
    color: "白色"
  },
  {
    name: "太平羊",
    age: 12,
    color: "黑色"
  }
];

console.log(myGoat[0])

「啊~卡關了~」草莓哀嚎中。

「很好啊你已經拿到第一隻羊咩咩了,這時候如果想拿到名字的話可以這樣寫。」


console.log(myGoat[0].name)

「還有另外一種寫法。」


console.log(myGoat[0]['name'])

「出現味愧羊了耶!熊熊好棒~」草莓開心的拍拍手。

「怎麼聽起來還是怪怪的 ...」

img

明日待續~


上一篇
Day23
下一篇
Day25
系列文
StrawBeary 網頁工程三十天30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言