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

# 4/6 線上 Slack 助教

## 今日輪班助教時間

hsin-yu：4/6（二）
早上 10:00 - 中午 12:00，下午 1:00 -下午 5:00

## 發問規範

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

## 注意

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

## 問題

1. **Hsin：**
助教好~這是我的 [codepen](https://codepen.io/hsinhui/pen/PoWjRQQ?editors=1010)，在刪除特定產品的功能中，有時候加了3筆以上，刪除的時候會跳出輸入的ID不存在，想了很久還是不知道問題出在哪? 再麻煩助教了，謝謝!
> 助教回覆：
> 因刪除一個產品後（假設刪除 data-num 是 0 的產品），刪除成功後會重新渲染購物車列表（第 139 行），會有新的 data-num 是 0 的產品，但 cartItem[num].id （第 148 行）會抓到原本 data-num 是 0 的 id（cartItem 物件中還是有原本被刪除的產品），因此會有找不到 id 的情況
可以嘗試調整看看，如果有卡關的地方可以再提問喔：）

---
2. **axlrock1021：**
助教好~想請問有關迴圈的問題，我自己練習想做一個倒數計時器，想請問我在for loop裡面下log，是有顯示0-100每筆資料，但是畫面最後呈現卻只有最後一筆100%，沒有每秒更新狀態，想請問是不是我寫錯還是有其他方法呢，感謝!
https://codepen.io/lnjbmmxo/pen/PoWKPmK
> 助教回覆：
> 因 codepen 中不知道 this.progress 的內容，需要麻煩同學附上完整的程式碼，比較容易找出問題點喔～

---

3. **咖哩：**
助教好~想請問有關 validate 驗證問題
這是我的copen網址 https://codepen.io/bear-curry/pen/mdRMVMG
問題： 從 145行 開始
let newAry ＝ Object.keys(errors)
newAry放的 這２個位置 146行 / 154行 為啥會有差異？？
146行 位置01 :
驗證到最後一步,無法新增資料,在Chrome噴出錯誤
Uncaught TypeError: Cannot convert undefined or null to object
154行 位置02 :
順利驗證,沒錯誤跑出,也順利新增資料進去？？
> 助教回覆：
> 因如果將宣告 newAry 的部分放在 146 行，若資料都填正確可以新增資料就不會有錯誤( 第 143 行宣告的 errors 就會是 undefined
可以在 146 行前面執行 console.log(errors) ，若資料都填正確 errors 會是 undefined，這時候執行 Object.keys(errors); 就會出錯

---

4. **周周：**
老師助教同學們好，這是我的 [Codepen](https://codepen.io/jhoujhou-the-decoder/pen/KKavvzj)（請附上連結），我原本預期「畫面上的產品資料會排列在畫面上」，但卻出現「從上到下排列」，想問下問題出在哪裡？
> 助教回覆：
> 因版型的部分有套用 bootstrap 的樣式，需要載入 bootstrap 的 CSS 才會有樣式出來喔～

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">

> 另外渲染的部分 JS 第 20 行 `<div class="row productList"> </div>` 這層不需加在 productsstr 字串

---
5. **Valerie Chang：**
老師助教同學們好，這是我的[codepen](https://codepen.io/vicky-chang/pen/poRrrNz?editors=1011)，我原本預期「畫面上會出現list的清單」，但卻沒有出現，想問問題出在哪裡？
> 助教回覆：
> 因 renderList() (第 51 行）裡面是對 timeData 跑 forEach() ，但 timeData 沒有被賦予值（沒有資料），需換成 dataData 才有資料顯示

---

6. **Vincent86：**
老師助教同學們好，這是我的 [Codepen](https://codepen.io/mr86/pen/rNWXbqg)，我原本預期「JS 第 98 行會出現新增套票」，但卻出現「預期外的結果是 沒新增」，想問下問題出在哪裡？
另外 想多請問我原本預期「JS 第 105行會出現 全部地區 搜尋共3筆資料」，但卻出現「預期外的結果是 0筆」，想問下問題出在哪裡？
> 助教回覆：
> addTicket() 裡面的 ticketName 沒有正確選取到套票名稱的 input（第 106 行是選取到 '# tickerName’）
驗證的部分（第 136、144、152 行）有寫 alert.forEach(…)，但沒有宣告 alert 變數（也建議不要拿 alert 當變數），可以另外命名變數並選取 .alert-message 才能加上 .show 的 class 顯示提示文字

> 篩選地區的部分第 92 行 else if(e.target.value ==="全部")，判斷 target.value 若是 "全部"，但是 HTML 的部分（第 106 行）「全部地區」的 value 是空的，因此不符合判斷式，不會執行裡面的程式

（這裡只能由助教自行增加問題，請大家將問題放在 thread 上）