本頁只練什麼
能從事件物件讀取 type、target 與鍵盤 key，讓 handler 依實際事件分流。
不讀 event 而依全域狀態猜操作來源，會在多按鈕與鍵盤互動時更新錯元素。
要修改的檔案：files/starter/main.js
定位：先在 handler 第一行輸出 event.type。｜依 starter-1 定位，只修改「event object」的責任。
LESSON-17 · TOPIC 01
event object
能從事件物件讀取 type、target 與鍵盤 key，讓 handler 依實際事件分流。
任務情境
先結果，再原理；完成後要能說出自己看見的證據。
現在的問題
同一 handler 同時處理滑鼠與鍵盤卻無法分辨。
起始狀態：output 尚無事件紀錄。
完成後要看到
eventTypes 含 click/keydown、targetCount=1、key=Enter。
驗收證據：types=click/keydown、target/key 與派送操作一致
何時會用到
click、keydown、submit、input 與所有事件 handler。
常見混淆：event.type 是事件種類；target 是最初觸發節點，不是 listener 所在節點。
觀念與最小範例
這段程式是理解起點，不是要你直接跳過 Starter。
event object Event object
事件物件是瀏覽器交給 handler 的這次操作紀錄。
正式說法：Event instance 封裝 type、target 與依事件介面擴充的 key 等資訊。
handler(event) 內讀 event.type 與 event.target。三步完成本主題
每一步都留下可觀察結果；如果沒看到，先看「卡住先查」。
Step 1｜先看見目前缺口，不急著貼答案。
檔案：
files/starter/main.js定位：先在 handler 第一行輸出 event.type。要做：先重新載入 Starter，記錄目前畫面、DOM、Computed、Console 或文件內容。
預期：能指出「先在 handler 第一行輸出 event.type。」目前的缺口。
證據：保存 files/starter/main.js 的目前狀態，並指出下一步只會修改哪個檔案責任。
卡住先查：確認開啟的是 files/starter/main.js，且定位到 先在 handler 第一行輸出 event.type。。
Step 2｜只修改本主題的一個責任。
檔案：
files/starter/main.js定位：先在 handler 第一行輸出 event.type。要做：派送 click/keydown 並記錄 type、target 與 Enter key。
預期：eventTypes 含 click/keydown、targetCount=1、key=Enter。
證據：types=click/keydown、target/key 與派送操作一致
卡住先查：先在 handler 第一行輸出 event.type。
Step 3｜重新載入並以證據驗收，不以『看起來差不多』判定完成。
檔案：
files/starter/main.js定位：先在 handler 第一行輸出 event.type。要做：重新整理頁面，再逐項比對預期結果與 evidence。
預期：eventTypes 含 click/keydown、targetCount=1、key=Enter。
證據：types=click/keydown、target/key 與派送操作一致
卡住先查：先在 handler 第一行輸出 event.type。
觀察示範
這個示範只讓你看懂概念，不會替你修改 Starter，也不會自動宣告完成。
event objectruntime fixture · read-only demo
本主題示範畫面：
驗收證據
勾選只是學習紀錄；真正完成仍要回到 Starter 的實際結果。
提示 1｜方向
handler 的第一個參數就是事件物件。
提示 2｜關鍵片段
讀 type、target；KeyboardEvent 再讀 key。
提示 3｜完整解答與原因
完整解答與原因：listener 接收 event，click 記 type/target，keydown 額外記 key=Enter；因為這些欄位描述本次真實操作。