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

# 4/5 線上 Slack 助教

## 今日輪班助教時間

SONYKO：4/5（一）
早上 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>💕

1. **圈圈：**
助教不好意思，我卡在最終作業的 swiper 切版部分，我用 swiper.js 套件去做，在第一筆下 margin-left: 95px ，但同一行會掉一個 swiper-slide 下去。
> 助教回覆：
> 不確定是不是聰明的[解法](https://codepen.io/s_syoujyo/pen/oNBwebp?editors=1100)（咦） 不過看起來很正常 XDD
> 我先在 HTML 最前端設一個 swiper-slide 框框， 給他一個 class 。然後寫寬度給他（你想要 margin left 的寬度 ）， 再設 opacity : 0 讓他透明掉， 看起來就有 99.9% 像了！ 同學可以試試看 👍🏻
---
2. **Fred Chang**
老師助教同學們好，這是我4/1每日任務的 CodePen，這是助教的CodePen，共有兩個問題想請教：
* 因為資料中除了一般整數外，還有"未分組"這個值，所以在JS第27行做了判斷，一開始嘗試了好幾種===的判斷皆無法順利執行，最後使用了isNaN 才解決，想請問助教這樣使用是正確的嗎? 還是有什麼更好的寫法呢?
* 助教JS的10、18行使用=>來執行函式內容，請問這個寫法是單純省略function 嗎?還是有什麼特別用途呢?

以上兩個問題還請助教協助解答，感謝 🙏🏻
> 助教回覆：
> 🐼 問題 1
> 我覺得用 !NaN 來寫還滿不錯的～
> 另外助教的那種判斷寫法， 現在的 code 應該是可以動 (?!)
> 同學這個寫法很 ok 呀， 因為只是一個小判斷、只要可以正確判斷的都是好寫法 XDD
>
> 🐼 問題 2
> 那個是箭頭函式， ES6 新增的新方法。可以參考卡斯伯老師的[文章](https://wcc723.github.io/javascript/2017/12/21/javascript-es6-arrow-function/)。
> 至於助教這邊使用箭頭函式沒有特別用途歐。
> 同學也可以試著使用箭頭函式寫寫看， 程式碼看起來會不錯乾淨～

---
3. **Jordan_Tseng**
老師助教同學好，這是我的code。我主要想問關於上週助教教的驗證方式，我先放圖片，如果要看完整的可以看連結。因為助教那天分享的是change，所以只要一改動就會驗證跑出文字。也可以用click。但我想要的效果是只有第一次按下送出後，驗證的同時，才綁定change效果。效果是成功，但我覺得寫的好像怪怪的，但又想不出哪裏。想請助教幫忙怎麼優化好。

> 助教回覆：
> 這問題 ... 範圍有點廣啊
> 所以同學是想要問說 change 那邊的 code 有沒有問題這樣嗎(´・ω・｀)？！
> 我把你的檔案載下來看，個人比較好奇沒填資料時按送出、上面資料會消失的部分XDD
> 驗證這邊的 code ， 我覺得 change 包在裡面還 ok 阿， 用起來也滿正常的。 個人比較在意 checkOk = true 這個步驟好像比較攏。
> 要說的話， if 判斷式有兩個地方重複，可以抽出來。
> 
> 這邊給尼[參考 code](https://codepen.io/s_syoujyo/pen/YzpBLmo?editors=0010) ， 我的是外面有一層 submit 監聽， 但把 change 放在外面 OAQ
> 如果同學要的話可以按照你的寫法， 主要是程式碼綁 key 的地方可以獨立一個函式。 這部分可以再調整看看。
---
4. **周周**
老師助教同學們好，這是我的 CodePen，
我原本預期「JS 第 136 行會在網頁上顯示各組的圖表」，但網頁上只出現最後一組」，想問下問題出在哪裡？
> 助教回覆：
> 要修正的地方滿多的歐 OAQ
> 1. 同學取到的值是小組分數， 不是後面的趴數。 console.log 一下就會發現取錯哩。
>要這樣寫： `((groupNumTotal[item] / groupPeople) * 100).toFixed(1)`
>2. 我覺得把渲染跟 c3 物件塞在回圈裡很怪， 渲染的話會變成一直重複渲染， 一直蓋掉、所以只會留下最後一筆資料。 但我這邊把它提出來會跳 undefined ， 其他地方可能還要再修正一下。
>建議同學可以參考一下已完成組別的寫法。這邊也附上已完成組別的[範例](https://codepen.io/sandy3068/pen/LYxbpov?editors=0011)供同學參考。
>只剩下最後一組這點助教認為是因為同學把變數定義在回圈中， 渲染也在回圈中的關係。
>這邊應該要給設一個變數再回圈外， 用來累加回圈跑的每筆才是正確的。
>
>同學再試著修改一下， 若有疑問歡迎再提出哩。
---