---
tags: JS 直播班 - 2021 春季班
---
# 4/19 線上 Slack 助教
## 今日輪班助教時間
SONYKO：4/19（一）
早上 9:00 - 早上11:00，下午 1:00 -下午 5:00
## 發問規範
老師助教同學們好，**這是我的 Codepen**，我**原本預期**「JS 第 8 行會出現數字 8」，**但卻出現**「預期外的結果是 0」，想問下問題出在哪裡？
## 注意
1. 請各位先到 Slack 上將問題放在助教服務內的 thread，如圖
2. 遵循以上的發問規範以便助教查看問題，不可直接貼上網址而沒有說明文字或者只提供截圖
3. 助教會依照 Slack 上的順序回覆問題
4. 以下問題區塊只能由助教自行增加
5. 助教會將回覆寫在下方問題區塊
## 問題
🎀 <font color="#e5b3cc">這裡只能由助教自行增加問題，請大家將問題放在 thread 上 </font>💕
<font color="#fa6f98">
1. **獵人：**</font>
老師助教同學們好：
關於API中的Patch與PUT的差異不是很了解，
兩個都是更新資料，但在API上一個是前台更新購物車數量、一個是後台更新已處理狀態，看起來是很類似。
請問兩者有何差異呢?
以下為找到[網路說明](https://icelandcheng.medium.com/%E5%90%8C%E6%A8%A3%E6%98%AF%E6%9B%B4%E6%96%B0-http-%E5%8[…]t-%E5%92%8C-patch%E7%9A%84%E5%B7%AE%E5%88%A5-171eee8790b9)，但還是不懂? 謝謝
> 助教回覆：
> 簡單來說， put 就是全部更新、 patch 是部分更新。
> 假如我今天寫了一篇文章， 包含 title 和 文章內容。 我覺得 title 想換掉 ， 如果我用 put 修改， 我必須整包連同文章內容一起丟回去做修改。
>
> 但我今天只想要修改 title 有必要這樣嗎 !? 因此 patch 就誕生ㄌ。
> patch 可以做局部修改， 意思就是我今天想改 title 、我只要回傳 title 的部分就好， 不用整包丟回去。
>
> 所以大家才會說 put 是 「取代」 path 是 「修改」 。
> 實際上 put 的行為真的比較像是取代， 透過覆蓋新的資料來達到修改的效果。
> patch 就真的是修改， 只修改想訂正的地方 這樣。
>
> 以上說明若有不懂的部分歡迎再提出唷～
---
<font color="#fa6f98">
2. **雅帆：** </font>
老師助教同學們好，這是我的 [CodePen](https://codepen.io/yafanchung/pen/MWJqbEO?editors=1011)
想請問如果有成功的點擊到購物車的按鈕，會什麼 JS 第 49 行不會如預期地執行成功的撈到 id 的值呢?想請問我是有哪邊寫錯嗎?感謝!
> 助教回覆：
> 程式碼 33 行的地方， 圈起來的地方漏掉雙引號喔～
> 
> 補上去就取得到了～
><font color="#bbb">
> 追記：
> classBtn 取出來會是 btn btn-primary js-btn ，所以不管怎麼按加入購物車都會跳 alert 。
主要會取不到是因為 if 判斷式最後加了一個 return ;
把這行 return 槓掉也是可以取得到 >A < ;
</font>
---
<font color="#fa6f98">
3. **Valerie:** </font>
老師助教同學們好，這是我的 CodePen
「JS 第 232 行改成中文後」，「驗證顯示不出來」，請問問題出在哪裡？ 謝謝
> 助教回覆：
> 會報錯是因為找不到 document.querySelector(`.${item}`) 的值， HTML class 也要修改成中文。 修改完應該就會顯示出來囉。
> 
---
<font color="#fa6f98">
4. **程翔：** </font>
老師同學們助教好 這是我的CODEPEN https://codepen.io/xxxiang/pen/KKaBEYL?editors=0010
原本預期訂單狀態可以順利更改 但是只能把未處理改成以處理
沒辦法把以處理改成未處理 程式寫法也參照老師的步驟 只是命名方式有點不同 煩請助教可以幫我除錯嗎@@
> 助教回覆：
> 這個 api 有個小小的陷阱， 就是他的 true 其實是字串不是布林值。
印為是字串， 所以判斷時要加上雙引號。 如下( 69 行)：
>
> 修改後判斷應該就正常了。 同學試著改看看哩～
---
<font color="#fa6f98">
5. **SeanLiu 家興：** </font>
[4/19 每日任務連結 CODEPEN](https://codepen.io/LuckyTiger/pen/MWJqbpE)
不知道為什麼畫面都會重新整理兩次，一開始以為是非同步問題，
但後來到 devTools 看，是 codepen 會發兩次，用 Debug mode 就沒問題，
想請問一下這樣理解正確嗎? 補充這位同學的 [codepen](https://codepen.io/LinaChen/pen/abpamXV) 寫法不會重新整理兩次，感謝助教的協助
> 助教回覆：
> 助教們這邊開啟沒有出現重新整理兩次的問題 OAQ
> 同學可以錄下畫面及操作過程供我們檢視， 才能得知問題點在哪。
---
<font color="#fa6f98">
6. **moitw：** </font>
助教好，這是我的 [codepen](https://codepen.io/tsuifei/pen/bGgxWOq) 。
在購物車的刪除部分，在刪除單筆和刪除全部的綁定監聽按鈕執行的程式裡，184,199行 各塞了getCartList(); 讓畫面重新渲染，但似乎不起作用，後面放了各console.log("test");也會執行，就是畫面不會渲染，可否麻煩協助提示有問題的部分？
> 同學已找到解答：
> 在購物車渲染那裡加了個條件就好了
> ```
> if (dataShoppingList.length == 0) {
> shoppingCartList.innerHTML = `<h3 class="
> shoppingCart-message">購物車裡沒商品囉！</h3>`;
> }
> ```
> 同學好棒 👏🏻👏🏻👏🏻
---
<font color="#fa6f98">
7. **Pei Wang:** </font>
助教同學好
不知道可不可以問這邊....
目前所有作業都有交，最終完成到LV2，預期會顯示100%，但進度調顯示90%是正常的嗎？
> 助教回覆：
> > 他是 24 小時更新一次，不是即時，所以如果你提交獎品，可以直接填寫 100% 哩~
> > by 洧杰老師。
---
<font color="#fa6f98">
8. **Sol ：** </font>
助教好
這邊在提交最終作業有些疑問, 想請助教提點
https://codepen.io/solhuang/pen/rNjpqOV
在使用 validate.js 套件時
該如何設定當 input "change" 時 可以只跳出該 message 而不是一下跳出所有 message
看了一下範例與同學的作業, 大多都有一樣的問題, 這部分該如何處理? 感謝
> 助教回覆：
> 主要是因為 同學在 change 監聽內又再跑了一次迴圈， 才導致一個填錯通通錯誤都一並渲染出來。 助教的做法是把迴圈拿掉， 並將 keys 改為 item.name 就可以達到同學想要的效果。
---
<font color="#fa6f98">
9. **Harvey ：** </font>
老師助教同學好,這是第六周的小組任務,我在時間比序方面遇到了麻煩,自己的作法(JS 58~83)沒有辦法考慮到上下午的問題,想請老師給予意見!
> 助教回覆：
> [助教寫法範例](https://codepen.io/s_syoujyo/pen/dyNgyEO?editors=0011)
> 先分上下午， 兩邊都把中文剪掉再拼起來（變成無中文的時間格式）。
> 如果是下午的話， 時間就 + 12 小時。
> 整理完時間直接 sort 就可以了。 同學可以參考一下範例。
> 有問題歡迎再提問哩！
---
<font color="#fa6f98">
10. **Stacey Huang ：** </font>
老師助教同學們好，這是我的 CodePen,在163行~190行的函式addOrder,不曉得為什麼在送出訂單後,無法在API文件中取得送出的訂單,並在未填寫訂單資料時,按下送出按鈕,雖然會短暫出現提醒文字,但還是跳轉到Not Found的頁面，以上再麻煩助教了,謝謝
> 助教回覆：
> 因為送出訂單的 input 為 `type="submit"` ， 會有跳轉頁面的問題。 因此這邊只要在 addOrder 含式第一行加入 ` e.preventDefault();` 就可以成功送出訂單哩。
> 同學可以試試看， 有問題歡迎再提問唷！
---
<font color="#fa6f98">
11. **Page Shih ：** </font>
老師助教同學們好，這是我的 [CodePen](https://codepen.io/kanawin821/pen/yLgxNNb?editors=0001)，
這邊有跟著老師的馬拉松直播(下午場)做，「我的codepen 124-130的status取出來的是字串，所以174-178的判斷時應該是無法直接用布林值判斷」，但「老師的直播卻可以成功出現結果(2:55:00)，猜測應該是因為(status==true)不管status是什麼內容，因為都是字串的關係，所以都會回傳false，所以可以把"未處理"變成"已處理"，但若要從"已處理"變成""未處理"應該是沒辦法?」，想問下如果「字串要轉布林值的話有什麼方法」嗎？
> 助教回覆：
> 助教這邊是在程式碼 174 行的判斷是改成
>
> ```
> if(status == "false"){
> newStatus = true;
> }else{
> newStatus = false;
> }
>```
> false 改為字串判斷， 就可以正常切換了 >A < ;
> 但是不建議把監聽寫在渲染函式內， 建議要關注點分離。
> 我是把 completeOrder 塞在 127 行， 雖然判斷成功但會重複發出請求， 建議修改訂單狀態要獨立函式寫。
> 同學可以試著改寫看看， 若有問題歡迎隨時提問唷！
Sign in with Wallet
Connect another wallet