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

# 3/19 線上 Slack 助教

## 今日輪班助教時間

暄雯：3/19（五）
早上 9:00 - 早上 11:00，下午 1:30 - 下午 5:30

## 發問規範

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

## 注意

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

## 問題

1. **獵人：**
助教好，第五周作業中有些疑問。
針對元素使用以下語法取得
let ticketName = document.querySelector('ticketName');
但助教建議是使用const。
可以理解是不要讓人更改元素內容。
但是改為以下後
const ticketName = document.querySelector('ticketName');
還是可以變更元素的value內容
ticketName.value ='';
這是為什麼呢?
謝謝
https://codepen.io/tyriel/pen/xxRBYBN
> 助教回覆：
> ticketName 和 ticketName.value 這兩個的值不一樣哦，
ticketName 儲存的值為「 id = ticketName 的 HTML 標籤 」，
ticketName.value 則是指 「id = ticketName 的 HTML 標籤裡輸入的 value 值」。
>
>因為修改 value 的內容並不會影響到 HTML 標籤，所以執行 ticketName.value = ''; 時，ticketName 本身的值並沒有改變，它還是 id = ticketName 的 HTML 標籤。
>
>以你的作業為例，ticketName.value 有宣告 name 這個變數來儲存。如果這邊把 name 改用 const 宣告，那執行 name = '' 就會出現錯誤，因為 name 變數的值不能再更改。

---
2. **Hi Annie**
老師助教同學們好，這是我的 [Codepen](https://codepen.io/lhohdalu/pen/YzpBbrP?editors=0012)，「JS 第 48 行不曉得為什麼可以計算出各區里長人數，想了解原理，或者其實寫錯了」？
> 助教回覆：
> total[item.區別] = total[item.區別] ? total[item.區別]+1 :1;
這一行是三元運算值的用法，？前面的條件如果為 true，則執行冒號前面的表達式：total[item.區別]+1；如果為 false 則執行冒號後面的表達式：1。
這邊提供文件給你參考：[條件運算子](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
>
>目前 total 是空物件，裡面沒有 item.區別的屬性，所以判斷 total[item.區別] = total[item.區別] 時會回傳 false，因此會新增「item.區別」這個屬性，並賦予值為 1。若已經有這個屬性，則 total[item.區別] = total[item.區別] 為 true，會執行 total[item.區別] + 1，因此數量 + 1。
>
>例如：第一次執行到區別為前鎮區的資料時，item.區別 = 前鎮區，total[item.區別] = total[item.區別] 為 false（目前沒有這筆資料），所以執行冒號後面的表達式，total 會增加「前鎮區」這個屬性，數量加一。如果第二筆資料也為前鎮區，因為已經有前鎮區的屬性，所以為 true，直接數量 + 1。
>
---
3. **一美**
助教你好，
想請問今天 3/19(五) 每日作業中，
為什麼在圖３第9行顯示的結果（如圖４），是沒辦法繼續累加？
但如果多加一行 el.value = newValue 之後（如圖1），又能達到累加的效果呢？
> 助教回覆：
el.value 取到的是 input 裡面輸入的值，可以透過檢視 input 的內容來得知目前 el.value 的值為什麼。
>
>如果沒有加上 el.value = newValue 這一行的話，函式執行完，input 的值並不會被修改。因此重新點擊按鈕時，newValue 被賦予 el.value 的值還是為 200。
如果加上 el.value = newValue，則點擊一次按鈕，input 的值就會被修改，所以 newValue 每次都會不一樣。
>
>這邊提供範例給你參考：[3/19 每日任務 累加效果](https://codepen.io/skar5268/pen/eYBwrNx?editors=0011)
>
---
4. **黑川**
助教好:
想請問一個陣列中的物件，裡面還有包陣列取值的問題，如 [codepen](https://codepen.io/kurokawa/pen/QWGXBEd?editors=0010) foreach之後產生的HTML是正確的，但在
99行 < ul class="tag-box" >
裡頭，我無法取到我陣列中tag裡面的title和link，所以我再foreach一次來產生li
不過問題出來了，我做完之後發現它會一直累加上去如目前的樣子
但我需要的樣子是跟我data裡面一樣的tag數量 JS的第10行，32行，49行
(如第一則內容的tag是4個，第二則內容是2個，第三則內容是2個)
還請助教解惑!
> 助教回覆：
> 目前 li 是在 data.forEach() 外宣告為變數並賦予空字串。
> li 的值在跑完一筆資料後會被記錄下來，跑下一筆資料時會沿用上一筆 li 的值，因此列表的內容會一值累加上去。
> 建議可以在 data.forEach() 裡面先賦予 li 為空字串（清除之前的資料），再執行 liary.forEach() 哩～

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