---
tags: 2021 程式體驗營
---
# 6/23 每日任務 Day13
## HTML 任務題目
今天練習在 codepen 上使用 SCSS 寫樣式：
1. 請同學按照教學影片 打開 codepen 新增一個 pen
2. 把 CSS 區塊的格式設置為 SCSS
3. 在 CSS 區塊中練習添加三到五個變數
4. 將 codepen 連結貼至下方回報即完成
附上完成示意圖(變數部分同學可自行設計，圖片僅供參考)：
## JS 任務題目
請同學觀看 50 小時影音教學的 ***陣列教學*** 章節影片，學習完畢後回答下方問題：
1. 請分別寫出 pop、shift、push、unshift、splice 五種陣列操作方法用於實現哪些功能
2. 請同學以下方的陣列為基準撰寫程式碼，挑選上方的至少三種方式來實際運用看看
3. 請給自己撰寫出來的代碼加上備註 比如你這行做了什麼行為，在執行後 console.log(socialMedia) 的結果會是什麼
```javascript=
let socialMedia = ["LINE", "FB", "IG", "DCARD", "WeChat"]
// 方向參考：
// 1. 可以嘗試增加一個新的社群軟體在某個特定索引位置
// 2. 可以嘗試刪除某一個特定的社群軟體
// 3. 可以練習增加一個在最後方 接著使用刪除最後一個 刪掉剛才新增的
// 4. 可以練習一次增加多個或刪除多個
// 5. 以此類推自行延伸 ...
```
## 回報流程
1. 將答案貼在 Codepen 並複製 Codepen 連結貼至「回報區」回報
（也可以將答案直接貼至「回報區」）
## 作業回報區
<!--
1. WangShuan - 答案:
ＨＴＭＬ：最上面就有完成示意圖了，你還想看什麼？美麗的我嗎？
ＪＳ：
第一題， pop 刪最後一個資料、shift 刪第一個資料、push 寫入新資料在陣列最後面、unshift 寫入新資料在第一個位置、splice 刪除指定位置開始算起的幾筆資料。
第二題跟第三題：
```javascript=
let socialMedia = ["LINE", "FB", "IG", "DCARD", "WeChat"];
socialMedia.push("Twitter") // 我要把 Twitter 加到 socialMedia 的最後方，我覺得結果會是 ["LINE", "FB", "IG", "DCARD", "WeChat", "Twitter"]
console.log(socialMedia)
socialMedia.splice(3,2) // 我要從 DCARD 開始刪除兩個值，我覺得結果會是 ["LINE", "FB", "IG", "Twitter"]
console.log(socialMedia)
socialMedia.shift() // 我要刪掉第一個 LINE ，我覺得結果會是 ["FB", "IG", "Twitter"]
console.log(socialMedia)
```
-->
1. [drumrick - HTML & JS 作業](https://codepen.io/drumrick/pen/LYWowQY)
2. [Hi Annie - HTML & JS作業](https://codepen.io/lhohdalu/pen/wvJLBjr?editors=1111)
3. [Benson - HTML & JS作業](https://codepen.io/polarBear712/pen/GRWbgdr)
4. [henry - HTML & JS作業](https://codepen.io/henrymorgan666/pen/RwpzNdK)
5. [Natsu小夏 - HTML作業](https://codepen.io/natsunari/pen/QWpXbbZ?editors=0100)
6. [Teddy Wu - HTML 作業](https://codepen.io/hongwei0522/pen/qBrzEgd)
7. [Lina Chen - HTML & JS作業](https://codepen.io/LinaChen/pen/XWMLbmr)
8. [BaoH - HTML & JS作業](https://codepen.io/baoh/pen/bGqPNPv)
9. [Sz - HTML & JS 作業](https://codepen.io/szyln/pen/jOBjPMd)
10. [Katie-HTML & JS作業](https://codepen.io/aria-mi/pen/eYvwNWY)
11. [Yao Lin - HTML & JS作業](https://codepen.io/yaoyaoiii/pen/XWMLbxK)
12. [Xing CT - HTML & JS作業](https://codepen.io/xing10/pen/GRWbJry?editors=1100)
13. [阿丁兒 - HTML & JS 作業](https://codepen.io/dingpachan/pen/NWpZGgq)
14. [ZY Hsu - HTML & JS 作業](https://codepen.io/zihyin/pen/dyvBYZg?editors=1011)
15. [雅琇 Alicia - HTML作業](https://codepen.io/yahsiu-hsu/pen/MWpMKZz)
16. [Mao - HTML & JS 作業](https://codepen.io/vsfvjiuv-the-typescripter/pen/oNZrxGW)
17. [HsiuTing - HTML & JS 作業](https://codepen.io/syutei/pen/NWpZRXa)
18. [Min - HTML作業](https://codepen.io/minnn7716/pen/BaWgpoe)
19. [yu shiuan chang HTML & JS 作業](https://codepen.io/prankaChang/pen/YzZoZxX?editors=1111)
20. [Jane Lin - HTML & JS 作業](https://codepen.io/as60160/pen/LYWKENo)
21. [Anne Lin - HTML & JS 作業](https://codepen.io/mmj159/pen/LYWKeEq)
22. [Moto - HTML作業 & JS 作業](https://codepen.io/moto-san/pen/NWpZNgE?editors=0100)
23. [Roger - HTML & JS 作業](https://codepen.io/redtea227/pen/WNpqdyX)
24. [Haley - HTML & JS 作業](https://codepen.io/wsx3690/pen/xxqojwQ?editors=0110)
25. [Nap－HTML & JS 作業](https://codepen.io/o0o0o1o0/pen/ExWBOVW)
26. [我是明達 - HTML & JS 作業](https://codepen.io/bmzpfyxe/pen/dyvBwyr?editors=0010)
27. [Null - HTML作業](https://codepen.io/Whale-Cat/pen/JjWQqzE)
28. [Sabrina](https://codepen.io/a120220ms25/pen/bGqPEdg)
29. [Jeff H](https://hackmd.io/@jeff14994/H10xDlBq_/https%3A%2F%2Fhackmd.io%2F%40jeff14994%2FHJB4cCi9_%2F%252Ftr2SUQD6TByl4UGnxjfvug)
30. [YOYO－HTML & JS 作業](https://codepen.io/lumedkle/pen/XWMvVPx?editors=1011)
31. [Ching Hua - HTML & JS 作業](https://codepen.io/ching-hua-wang/pen/qBreYjL?editors=1011)
32. [Saiki - HTML & JS 作業](https://codepen.io/rostpfette/pen/mdWZEXY)
33. [Qian - HTML & JS 作業](https://codepen.io/qianhuiwei/pen/mdmbZQj)
34. [Kelvin-Wu - HTML & JS 作業](https://codepen.io/kai5363/pen/GRmRjeR)
35. [袁祥恩](https://codepen.io/ovfxsavp-the-bashful/pen/GRmgWqX?editors=0010)
36. [betty - HTML & JS 作業](https://codepen.io/betty-hu/pen/QWvjeNB?editors=1111)
37. Shiny - [HTML & JS 作業](https://codepen.io/shinychen/pen/bGWwNde)
38. [zong-huan - HTML & JS 作業](https://codepen.io/wxsobwib-the-encoder/pen/PomEwWZ?editors=1111)
Sign in with Wallet
Connect another wallet