---
# System prepended metadata

title: 3/17 線上 Slack 助教
tags: [JS 直播班 - 2021 春季班]

---

---
tags: JS 直播班 - 2021 春季班
---

# 3/17 線上 Slack 助教


## 今日助教輪班時間

穎旻：3/17 (三) 
早上 10:00 - 中午12:00，下午 2:00 -下午 6:00

## 發問規範

老師助教同學們好，**這是我的 Codepen**，我**原本預期**「JS 第 8 行會出現數字 8」，**但卻出現**「預期外的結果是 0」，想問下問題出在哪裡？

## 注意

1. 請各位先到 Slack 上將問題放在助教服務內的 thread，如圖
 ![](https://i.imgur.com/nHE3sOx.png)
2. 遵循以上的發問規範以便助教查看問題，不可直接貼上網址而沒有說明文字或者只提供截圖
3. 助教會依照 Slack 上的順序回覆問題
4. 以下問題區塊只能由助教自行增加
5. 助教會將回覆寫在下方問題區塊

## 問題

1. 穎旻：
老師助教同學們好，這是我的 [Codepen](https://)，我原本預期「JS 第 8 行會出現數字 8」，但卻出現「預期外的結果是 0」，想問下問題出在哪裡？
> 助教回覆： 因為在....所以..，於是產生 0 的結果

---

2. Aasta Chen ：
老師助教同學們好，我不是Codepen那些部分有問題，而是對於第四關下列取值的部分，我寫的出來，但理解不了為什麼？想請問這個部分到底是為什麼這樣取值呢？
```
體重${bmiSatesData[bmiHistoryData[bmiHistoryData.length-1].state].state}！
健康指數為${bmiSatesData[bmiHistoryData[bmiHistoryData.length-1].state].color}！
```
> 助教回覆：可以將取值的部分先做拆解，
> 因為已知最後的結果會是 "overWeight" 所以可以先以這個目標來取值bmiStatesData["overWeight"].state -> 但因為需要拿到記錄內的最後一筆，所以替換成第二筆 -> bmiStatesData[bmiHistoryData[2].status].state
> 因為不能寫死第二筆，所以將 [2] 替換為 [bmiHistoryData.length - 1]，
得到最後的結果 bmiStatesData[bmiHistoryData[bmiHistoryData.length - 1].status].state

---

3. carol liao：
老師助教同學們好，這是我的 [Codepen](https://codepen.io/yaxuan/pen/ExNJwMO?editors=0010)，在 130 行輸入的值做判斷，但是必填只出現在第一個欄位，想請問要怎麼做才可以讓每個欄位都出現必填
> 助教回覆： 在第七週會使用套件做驗證的部分，做法是將不同欄位的錯誤訊息放在一個物件內（屬性名稱會對應到 input 的 class 或是id），使用 Object.keys 去跑迴圈對應到相同的 class 或 id
> 這邊如果不太理解也可以先跳過，做基本的驗證即可，也就是只要有任何一個欄位沒有填寫就出現 alert 通知，或是更簡單的做法是在 input 加上 required 屬性，不過 button type 需要改為 submit 唷

---

4. think：
老師助教你好，[這是我第五週主線codePen](https://codepen.io/gjjzibjk/pen/yLVWLpx?editors=1011)，在codePen按新增功能時，Console不會有任何紅字產生，而我在自己的網頁上，按新增時會跑出下方影片的狀況，但是功能都是有的，想問這是什麼原因?
> 助教回覆： 這邊可以將 1-10 行以及 220-222 行移除，雖然助教和你跑出來的錯誤訊息不太一樣，但是移除後就不會有錯誤了。在 Codepen 中是可以不用加上 <html><body>的，所以移除是沒有問題的，另外會造成錯誤的原因是因為他找不到第 8 行的 all.css 以及第 220 行的 all.js 喔

---

5. ZengZeng ：
老師助教同學們好，
我想詢問上次穎旻助教直播內容分享BMI kata LV.2的寫法(附上節錄下來的codepen 與截圖 )
請問這個部分 if 判斷式的運用，不太理解為什麼可以這樣使用、還有「 !== 」是什麼意思呢？
> 助教回覆： !== 翻成中文的話是「不等於」的意思。這裡的判斷是 當 status 不等於空字串時就呈現 console.log 內的文字，反面意思就是當我在 printBmi 帶入的不是數字，而是中文或是其他符號時，在第一次 if 判斷的時候就不會進入任何一個區間，也就拿不到 status 了，所以此時 status 就會是空值。第二次的判斷主要是要預防空的 status。

---

6. Qizhen,Lin ：
老師助教同學們好，這是我的 Codepen，我想問是 JS 的 37行開始，我們塞了 li 進去，那html 的 li 一定要刪除嗎?會不會影響排版呢?如果又新增新的ul 裡面包好幾個 li 資料，那JS還會影響到原本 html 的li嗎?還是要在JS在寫一次 forEach呢?謝謝
> 助教回覆： HTML 內 的 li 其實不刪除也不會有問題，但是還是會建議你刪除XD。不會有問題的原因是因為 innerHTML 會先清空抓到的元素節點內的值，再放你要賦予的值，所以在 innerHTML 之前，HTML ul 內的元素會先被清空唷。

---

7. carol liao ：
老師助教同學們好，這是我的 [Codepen](https://codepen.io/yaxuan/pen/ExNJwMO?editors=1010)，用 querySelectorAll 選擇 calss，在 131 行跑迴圈，符合判斷條件就出現必填，但是如果欄位輸入值按 btn 後要怎麼讓必填消失，因為只想到 136 行的做法，但是也沒成功
> 助教回覆： 目前你的做法抓到的都是 p 標籤，並沒有對應欄位，如果要取消特定欄位的驗證資訊需要一一比對，在寫法上會有點不好操作，使用 change 做監聽，看是哪一個欄位不是空的時候才取消驗證資訊。這部分的實作我也會在第七週的助教直播中講解哩。

---

（這裡只能由助教自行增加問題，請大家將問題放在 [thread](https://hexschool-share.slack.com/archives/G01H6GA03UH/p1615946400008300) 上）


