---
# System prepended metadata

title: "\U0001F3C5 4/27 (二) 每日任務 Day 2"
tags: [Vue 直播班 - 2021 夏季班]

---

# 🏅 4/27 (二) 每日任務 Day 2
###### tags: `Vue 直播班 - 2021 夏季班`
> 1. 物件中分為「屬性」及「值」。
> 2. 屬性為物件中的欄位名稱，而值是該屬性所代表的值。
> 3. 「屬性名稱」在運作上都是以「字串」的形式儲存，所以命名上可以使用特殊符號

在物件內新增、修改、取得屬性時最常使用的方式是「點記法」:

### 點記法 (Dot notation)
```js=
let obj = {
    a: 'value A'
};
obj.$b = 'value B';  // 在物件 obj 新增一個帶有特殊符號的屬性 $b，值為 'value B'。
obj.a = 'value edit'; // 將物件 obj 屬性 a 的值修改為 'value edit'。
console.log(obj.a); // 取得物件 obj 屬性 a 的值
console.log(obj.$b); // 取得物件 obj 屬性 &b 的值
```

不過點記號在存取時會有一些限制。舉例來說，**當屬性名稱帶有數值、小數點、空格時，就無法正確運作**。這時就會改用「括弧記法」:

### 括弧記法 (Bracket notation)
```js=
let obj = {
    a: 'value A'
};
obj['-- data'] = '雨量資料'; 
obj['PM2.5'] = 25;
obj['1b'] = '1b';
console.log(obj['-- data']) // 結果為 '雨量資料'
console.log(obj['PM2.5']) // 結果為 25
console.log(obj['1b']) // 結果為 '1b'
// 也可以代入變數
let a = 'a';
console.log(obj[a]); // 結果為 'value A'
```

題目(請使用 CodePen 作答)
---
```js=
let c = ' 這是中文字';
let arr = {
  a: 'a',
  1: 'b',
  ' 這是中文字': 'c',
  'b': 'd',
  '--some data': 'e'
}

console.log();  // 請取得結果為 'b' 的值
console.log();  // 請取得結果為 'c' 的值，必須使用變數
console.log();  // 請取得結果為 'd' 的值，必須使用點記號
console.log();  // 請取得結果為 'e' 的值
```


回報流程
---
請同學依照下圖教學觀看解答、回報答案:

![](https://i.imgur.com/QtL8zEW.png)

回報格式如下圖，請在「回報區」使用註解回報答案 (為了統計人數，請同學依序加上「報數」)

![](https://i.imgur.com/L7kyew8.png)

<!-- 解答
// 1 方法一
console.log(arr['1']); // 請取得結果為 'b' 的值
// 1 方法二
console.log(arr[1]);  // 請取得結果為 'b' 的值

// 2
console.log(arr[c]);  // 請取得結果為 'c' 的值，必須使用變數
// 4
console.log(arr.b);  // 請取得結果為 'd' 的值，必須使用點記號
// 5
console.log(arr['--some data']);  // 請取得結果為 'e' 的值
-->

回報區
---
<!-- 報數1: Eric-小偉哥 
CodePen: https://codepen.io/ericLoveDesign/pen/dyNrqOE?editors=1111
-->

<!-- 報數2: Alpha 
CodePen: https://codepen.io/alphatero/pen/oNBVPZO

-->

<!-- 報數3: leolee 
CodePen: https://codepen.io/nekorice/pen/dyNrqpL
-->

<!-- 報數4: Vic
CodePen: https://codepen.io/hsuan333/pen/OJWqomN
-->

<!-- 報數5: WA 
CodePen: https://codepen.io/ldddl/pen/GRreXMp?editors=0010
-->

<!-- 報數6: kevin嘉軒 
CodePen: https://codepen.io/kevin-chang-the-sasster/pen/LYxaJLv
-->

<!-- 報數7: Joe Kuo 
CodePen: https://codepen.io/alertislow/pen/yLgwxop?editors=1011
-->
<!-- 報數7: 小魚 
CodePen: https://codepen.io/jarvis1993/pen/XWpGPZx?editors=0010
-->

<!-- 報數9: Ethan
CodePen: https://codepen.io/blazer030/pen/PoWLdeG
-->

<!-- 報數10: Erica
CodePen: 
https://codepen.io/ericadu/pen/QWdoVBO
-->

<!-- 報數11: Lina Chen
CodePen: 
https://codepen.io/LinaChen/pen/yLgwxqj
-->

<!-- 報數12: Yi Chieh
https://codepen.io/Yi-Chieh/pen/XWpGPoo
-->

<!-- 報數13 : Alysa Chan 
https://codepen.io/alysachan/pen/vYgPzPG?editors=0011
-->
<!-- 報數14 : Li Shang 
https://codepen.io/li-shang/pen/MWJxqdq
-->
<!-- 報數15 : 鵬聖 
https://codepen.io/peng-sheng-lo/pen/QWdoVXm?editors=0010
-->
<!-- 報數16: 圈圈
CodePen: https://codepen.io/wei-the-lessful/pen/ExZMeBz
-->
<!-- 報數17: YOYO
CodePen: https://codepen.io/lumedkle/pen/yLgwRLR?editors=1111
-->

<!-- 報數18: zhfino
CodePen: https://codepen.io/zhfino/pen/zYNbmvV
-->

<!-- 報數19: Amanda Chiang
CodePen: https://codepen.io/cym199922/pen/abpMRNo?editors=0011
-->

<!-- 報數20: Tori
CodePen: https://codepen.io/hayen/pen/poRYxEQ?editors=0011
-->

<!-- 報數21: 家齊
Codepen: https://codepen.io/jacky298/pen/wvgOYrj
-->

<!-- 報數22: Iven
Codepen: https://codepen.io/rtorihnk/pen/OJWqodp?editors=1111
-->

<!--報數23: Eva lin
CodePen:
https://codepen.io/evalin0316/pen/WNRmaJY?editors=1111
-->

<!-- 報數24: 班尼
CodePen: https://codepen.io/fttp0165/pen/zYNbmPx?editors=1111
-->

<!-- 報數25: Carrie
CodePen: https://codepen.io/echocarriet/pen/PoWLxbX
-->

<!-- 報數26: shoppingq
CodePen: https://codepen.io/shoppingq/pen/OJWqagG
-->
<!-- 報數27: dah
CodePen: https://codepen.io/hua0124/pen/ExZMObv
-->


<!-- 報數28: Harold
CodePen: CodePen: https://codepen.io/YuWin0805/pen/abpMQVL?editors=0010
-->

<!--報數29: WuJungHan
codepen: https://codepen.io/JungHanWu/pen/BapbGrX?editors=0012
-->

<!-- 報數30: Ray
CodePen: CodePen: https://codepen.io/posidomcode/pen/eYgXQKv
-->

<!-- 報數31: Echo
CodePen: CodePen: https://codepen.io/echohuiecho/pen/zYNbMJE
-->

<!-- 報數32: 李重炫
CodePen: CodePen: https://codepen.io/otherway1123/pen/qBRvLdJ?editors=1011
-->

<!-- 報數33: peter.chen1024
CodePen: CodePen: https://codepen.io/JIAN-RONG/pen/gOgEZor?editors=0012
-->
<!-- 報數34: Izumi 泉
CodePen: https://codepen.io/izumi-dev/pen/gOgEZzM
-->

<!--報數35: Larry
codepen: https://codepen.io/manpower0708/pen/NWdJeyj?editors=1011
-->

<!--報數36: Jrhung-Tsai
codepen: https://codepen.io/Araytsai/pen/dyNraPG
-->

<!--報數37: Chiang
codepen: https://codepen.io/ChiangJ/pen/wvgONaP?editors=0011
-->

<!-- 報數38: Lin
codepen:https://codepen.io/linchinhsuan/pen/VwPRgNM?editors=1012 
-->

<!-- 報數39: kaiaChun
https://codepen.io/kaiatjp6/pen/RwKddMq?editors=0010
-->

<!-- 報數40: Yiren
https://codepen.io/Yiren_Liou/pen/qBRvvLK
-->

<!-- 報數41: Sec
https://codepen.io/Sentiments/pen/eYgXXqG?editors=1111
-->

<!-- 報數42: jimmyFang
https://codepen.io/nekorice/pen/dyNrqpL
-->
<!-- 報數43: Chiayu
codepen:https://codepen.io/c85771029/pen/poRYBrW
-->

<!-- 報數44: Ted Kuo
codepen:https://codepen.io/TedKuo/pen/VwPRNJv
-->

<!-- 報數45: yijun
codepen:https://codepen.io/sandy3068/pen/wvgObKP
-->
<!-- 報數46: Amber
codepen:https://codepen.io/amberTing/pen/YzNgbGG?editors=1011
-->

<!-- 報數47: Yu Chien
Codepen : https://codepen.io/ABURA/pen/bGgZJQR
-->

<!-- 報數:48 Alvin_Chu
CodePen:https://codepen.io/wave99487chu/pen/eYgXwGB
-->

<!-- 報數:49 Oober
CodePen:https://codepen.io/travis18/pen/MWJRgKz
-->

<!-- 報數50: JessieCheng
CodePen: https://codepen.io/JessieMosbi/pen/rNjbBZN?editors=0011
-->

<!-- 報數51: Pon Peng
CodePen: https://codepen.io/pengpon77/pen/MWJRWvy?editors=0011
-->

<!-- 報數52： Rita Huang
CodePen: https://codepen.io/Rita-Rossweisse/pen/OJWGJmd?editors=0012
-->

<!-- 報數53: Alicia Lo
CodePen:https://codepen.io/dkcyhyre/pen/rNjRPPV
-->

<!-- 報數54: Wendy Li
CodePen: https://codepen.io/pen/?editors=0011
-->

<!-- 報數54: 陳sam
CodePen: https://codepen.io/euldpliv/pen/YzNMPvz?editors=1111
-->

<!-- 報數55: Jasmin
CodePen: https://codepen.io/thejasmin/pen/abmrKyd?editors=1111
-->

<!-- 報數56: Ed Huang
CodePen: https://codepen.io/yide1986/pen/YzNMywe?editors=0011
-->

<!-- 報數57: Jennifer
CodePen: https://codepen.io/ma_nyeo/pen/WNRWQmQ?editors=0011
-->

<!-- 報數58: JOJO
CodePen: https://codepen.io/JOJOTai/pen/NWdmNpY?editors=0011
-->

<!-- 報數59: JordanTseng
CodePen: https://codepen.io/jordan-ttc-design/pen/OJWGNaZ?editors=1111
-->

<!--報數60: Stacey Huang
CodePen: https://codepen.io/staceyhuang/pen/yLgrJPe?editors=1111
-->

<!--報數60: youting
CodePen: https://codepen.io/youtingluo/pen/qBRwXGz?editors=1012
-->

<!--報數62: Jemma
CodePen: https://codepen.io/Jemma9/pen/jOyRGOZ?editors=1010
-->

<!--報數63: Cass
https://codepen.io/casslam/pen/qBRwxKb?editors=1011
-->
<!-- 報數64: Eason
https://codepen.io/alanwu0828/pen/abpxYGw?editors=0011 
-->

<!-- 報數65: 涂阿銘
https://codepen.io/asd40441/pen/RwKOeyp?editors=1111
-->
<!--報數66: 楊凱傑
https://codepen.io/kj25940858/pen/vYgMQGp?editors=1111
-->
<!--報數67: tim Chou
https://codepen.io/tim-chou/pen/jOyorbd?editors=1112
-->
<!--報數68 Fred Chang
https://codepen.io/fred8196/pen/yLgWEmZ?editors=0012
-->
<!--報數69 阿倫
Codepen:https://codepen.io/jason5125122/pen/vYgqpQP
-->
<!-- 報數70: FuChang
CodePen: https://codepen.io/fuchang830714/pen/MWJdGzE
-->

<!-- 報數71: Wei 
CodePen: https://codepen.io/uwhhiaxx/pen/NWdQwdy
-->

<!-- 報數72: Jack 
CodePen: https://codepen.io/yxzzktmb/pen/eYgqyvJ?editors=0011
-->

<!-- 報數73: Echo 
CodePen: 
https://codepen.io/bcq65958/pen/PoWMeWy
-->

<!-- 報數74: Patrick 
CodePen: 
https://codepen.io/argent1027/pen/XWpvYMZ?editors=1111
-->

<!-- 報數75: moitw
CodePen: 
https://codepen.io/alphatero/pen/oNBVPZO?editors=0010
-->

<!-- 報數76: Sean Liu
CodePen: https://codepen.io/LuckyTiger/pen/YzZKjvq
-->

<!--
報數 77 : Valerie
CodePen: https://codepen.io/vicky-chang/pen/eYvOLOw?editors=0012
-->

<!--
報數 78: Eyan
https://codepen.io/somebody1997/pen/jOBOYVe?editors=1011
-->
<!-- 報數 79: Josh Fang
https://codepen.io/joshfang-the-encoder/pen/abJbqdW?editors=1112
-->
<!-- 報數80: ted31539 
CodePen: https://codepen.io/Ted31539/pen/JjWjwEY
-->
<!-- 報數81: channing
CodePen: https://codepen.io/Channing/pen/vYxYPbL
-->
<!-- 報數82: twoz
CodePen: 
https://codepen.io/twoz/pen/mdWdoNO?editors=0012
-->

<!-- 報數83: Tofu Tseng
CodePen:
https://codepen.io/Tofutseng/pen/oNZgpOB?editors=0011
-->

<!-- 報數 84: Jay
CodePen:
https://codepen.io/jayredk/pen/OJpPZEz
 -->
 
<!-- 報數 85: Eric
CodePen:
https://codepen.io/toto9999912/pen/rNyVvQb
 -->
 
 <!-- 報數 86: Carol
CodePen:
https://codepen.io/taonong/pen/jOBbymb
 -->
 
<!-- 報數 87: Butters
CodePen:
https://codepen.io/Butterscode/pen/yLMYjMp
 -->
 
<!-- 報數 88: 田
CodePen:
https://codepen.io/ccyy915/pen/rNyxVBP
-->

<!-- 報數 89: MM
CodePen:
https://codepen.io/MINN3/pen/JjWGmjQ
-->

<!-- 報數 90 : Shino
codepen: 
https://codepen.io/shiiinnooo/pen/PopZvXE?editors=0012 
-->

<!-- 報數 91: Andrew Chi
CodePen:
https://codepen.io/wheresandrew/pen/ExWyjQM
-->

<!-- 報數 92: kevinhes
codepen
https://codepen.io/dwpwdpad/pen/MWpedGG
-->

<!-- 報數 93: Emily Hsi
codepen
https://codepen.io/EmilyHsi/pen/rNyWzyV
-->

<!-- 報數 94: yolala
codepen
https://codepen.io/chiakilalala/pen/yLvpQXM
-->