vault backup: 2026-04-30 12:29:38

hzh/EXAM/Week06.md

@@ -0,0 +1,794 @@
+---
+tags: []
+create time: 2026-04-30 15:30
+---
+
+# 前端摸底测试（第六次）— 错题精讲
+
+## 概述
+
+本次测试涵盖 **Axios、AJAX/XHR、JavaScript 核心、DOM/BOM、事件系统、CSS、浏览器存储与定时器、Node.js、Vue 3、React Hooks、Webpack、ESM 模块系统**等前端核心技术点。共 110 道单选题，本篇聚焦 37 道错题，按知识点分类逐一拆解错误原因并给出正确理解。
+
+> [!tip] 使用建议
+> 先通读各专题的"为什么错 → 为什么对"分析，再做右侧表格的自测检查，最后用「高频考点速览」串记薄弱概念。
+
+---
+
+## 一、请求层：Axios & AJAX / XHR
+
+### Q03：跨域方案辨析
+
+| 项目 | 内容 |
+| ------ | ------------ |
+| ❌ 你的答案 | B（服务器 cors） |
+| ✅ 正确答案 | D（axios） |
+
+---
+
+### Q04：XHR 终止方法
+
+> [!note] 纠正说明
+> 此题你答对了。**`xhr.abort()`** 是唯一标准方法来中止一个正在进行的 XHR 请求。
+
+### Q18：readyState = 3 的含义
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（已应答） |
+| ✅ 正确答案 | B（交互中） |
+
+```js
+// XHR readyState 五阶段
+const STATE = {
+  UNSENT:      0,   // 未初始化
+  OPENED:      1,   // open() 已调用
+  HEADERS_RECEIVED: 2, // 收到响应头
+  LOADING:     3,   // ↓ 正在下载响应体（交互中）
+  DONE:        4    // 完成
+};
+```
+
+> [!question] 💡 思考
+> 为什么 `LOADING(3)` 适合做"流式进度展示"而不是 `DONE(4)`？
+
+### Q38：AJAX 成功事件
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B（onreadystatechange） |
+| ✅ 正确答案 | A（onload） |
+
+```js
+// 推荐方式：onload — 简洁明了
+xhr.onload = function () {
+  if (xhr.status === 200) {
+    console.log(xhr.responseText);
+  }
+};
+
+// 旧方式：onreadystatechange — 需要自行判断状态
+xhr.onreadystatechange = function () {
+  if (xhr.readyState === 4 && xhr.status === 200) { /*...*/ }
+};
+```
+
+> [!important] 记忆要点
+> - **`onload`**：请求完整结束（等同于 readyState===4），仅区分成功/失败
+> - **`onerror`**：网络级别失败（DNS 错误、断网等）
+> - **`onreadystatechange`**：状态每变化一次都触发，需手动检查 `readyState === 4`
+
+### Q39：CORS 响应头
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（Cross-Origin-Resource-Policy） |
+| ✅ 正确答案 | A（Access-Control-Allow-Origin） |
+
+> [!warning] 避坑
+> 这是**服务端返回**的响应头，格式为 `Access-Control-Allow-Origin: https://example.com`。客户端不需要手动设置这个头部。
+
+### Q40：解析 JSON 响应的 API
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B（XML.parse()） |
+| ✅ 正确答案 | A（JSON.parse()） |
+
+> [!abstract] 冷知识
+> XHR 原生支持 `responseType = 'json'`，此时 `xhr.response` 直接就是解析好的 JS 对象，无需手动 `JSON.parse()`。
+
+---
+
+## 二、HTTP 协议基础
+
+### Q51：HTTP 400 状态码
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（请求方式错误） |
+| ✅ 正确答案 | D（请求参数错误） |
+
+> [!memory] HTTP 状态码速记表
+>
+> ```mermaid
+> graph LR
+>   A["2xx 成功"] --> A1["200 OK"]
+>   A --> A2["201 Created"]
+>   B["3xx 重定向"] --> B1["304 Not Modified"]
+>   C["4xx 客户端错误"] --> C1["400 Bad Request"]
+>   C --> C2["401 Unauthorized"]
+>   C --> C3["403 Forbidden"]
+>   C --> C4["404 Not Found"]
+>   D["5xx 服务端错误"] --> D1["500 Internal Server Error"]
+>   D --> D2["502 Bad Gateway"]
+> ```
+
+### Q52：Content-Type 的作用
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（响应的资源类型） |
+| ✅ 正确答案 | A（请求体的类型） |
+
+> [!example] 常见 Content-Type
+> - `application/json` — JSON 数据（最常用）
+> - `application/x-www-form-urlencoded` — 传统表单
+> - `multipart/form-data` — 文件上传
+> - `text/html` / `text/css` / `image/png` — 响应端
+
+---
+
+## 三、JavaScript 核心概念
+
+### Q07：JS 数据类型辨析
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（RegExp） |
+| ✅ 正确答案 | D（String） |
+
+> [!question] 💡 思考
+> 为什么 RegExp / Function / Array 属于引用类型（对象），而 String 是基本类型？
+
+```js
+typeof /pattern/   // "object" → RegExp 是对象类型
+typeof function(){} // "function" → Function 是对象类型
+typeof []           // "object" → Array 是对象类型
+typeof "hello"      // "string" → 基本类型！
+typeof new String("a") // "object" → String 包装对象才是对象类型
+```
+
+### Q06：值传递 vs 引用传递
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（10） |
+| ✅ 正确答案 | A（9） |
+
+```js
+let num = 9;
+function fn(num) {
+  num = num + 1;  // 修改的是函数局部参数，不影响外层
+}
+fn(num);
+console.log(num);  // 9 —— 基本类型按值传递
+```
+
+> [!example] 对比：引用类型的行为（Q14）
+> ```js
+> let arr = [1];
+> function fn(arr) {
+>   arr.push(3);  // 修改的是同一块堆内存
+> }
+> fn(arr);
+> console.log(arr);  // [1, 3]
+> ```
+
+### Q23：一元加号 + 的类型转换
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（string） |
+| ✅ 正确答案 | B（number） |
+
+```js
+typeof +'136';  // "number"
+// 等价于：Number('136') → 136
+// '+' 作为一元运算符时，会将操作数转换为数字
+```
+
+### Q13 & Q43 & Q44：事件循环（Event Loop）输出顺序
+
+这三道题都在考同一个核心：**同步 → Promise微任务 → setTimeout宏任务**。
+
+| 题目 | ❌ 你的答案 | ✅ 正确答案 |
+|------|------------|-------------|
+| Q13 | D | C（2→3→5→4→1） |
+| Q43 | D | A（8,9,5,5,5,5,5） |
+| Q44 | D | A（23541） |
+
+以 Q13 为例，执行过程分解：
+
+> [!abstract] Event Loop 执行流程
+>
+> ```mermaid
+> flowchart TD
+>   A["同步代码开始执行"] --> B["setTimeout 注册宏任务"]
+>   B --> C["Promise 立即执行"]
+>   C --> D["for 循环 resolve"]
+>   D --> E["console.log 5"]
+>   E --> F["同步代码结束"]
+>   F --> G["微任务 then"]
+>   G --> H["宏任务 setTimeout"]
+> ```
+
+> [!tip] 记忆口诀
+> **"同步先行，微任务跟进，宏任务殿后"**
+>
+> 输出顺序始终是：**2 → 3 → 5 → 4 → 1**
+
+对于 Q43（var 闭包陷阱）：
+
+```js
+console.log(8);            // 1. 同步输出 8
+for (var i = 0; i < 5; i++) {
+  // var 没有块级作用域，i 最终值为 5
+  setTimeout(() => console.log(i), 1000 * i);
+  // 5个定时器全部注册为宏任务
+}
+console.log(9);            // 2. 同步输出 9
+// 3. 1秒后依次输出 5,5,5,5,5
+```
+
+### Q27：对象引用赋值
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（'teal'） |
+| ✅ 正确答案 | B（'red'） |
+
+```js
+let obj1 = { uname: 'teal' };
+let obj2 = obj1;             // 引用赋值，指向同一块内存
+obj2.uname = 'red';
+console.log(obj1.uname);     // 'red' ← obj1 也变了！
+```
+
+### Q01：Axios 拦截器的问题
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D |
+| ✅ 正确答案 | D（B和C都对） |
+
+> [!note] 纠正说明
+> 此题你答对了。关键两点：
+> - **token 过期应先尝试刷新**，而非直接跳转登录
+> - **SPA 中应使用路由跳转**（如 `router.push('/login')`），`window.location.href` 会触发整页刷新，破坏 SPA 体验
+
+### Q12：响应拦截器异常处理
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C |
+| ✅ 正确答案 | C（两个回调位置写法） |
+
+> [!note] 纠正说明
+> 此题你答对了。注意签名顺序：`use(onFulfilled, onRejected)`——**先成功回调，后失败回调**。
+
+### Q100：Node.js 启用 ESM
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（--experimental-modules） |
+| ✅ 正确答案 | D（B和D均正确） |
+
+两种方法均可启用 ESM：
+1. `package.json` 中添加 `"type": "module"`
+2. 使用 `.mjs` 扩展名
+
+> [!warning] 注意
+> `--experimental-modules` 是 Node 12~13 的临时标志，Node 14+ 已移除，不再是推荐做法。
+
+---
+
+## 四、事件系统与 DOM/BOM
+
+### Q02：取消默认事件的正确方法
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（preventDefault()） |
+| ✅ 正确答案 | C（preventDefault()） |
+
+> [!note] 纠正说明
+> 此题你答对了。
+> - `preventDefault()` → **阻止默认行为**（如链接跳转、表单提交）
+> - `stopPropagation()` → **阻止事件冒泡**
+> - `cancelBubble = true` → IE8 时代的旧写法
+
+### Q16：获取 CSS 样式的方法
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（getElementStyle()） |
+| ✅ 正确答案 | B（getComputedStyle()） |
+
+```js
+// 标准写法
+const style = getComputedStyle(element);
+console.log(style.fontSize);
+
+// 兼容性写法（IE8-）
+element.currentStyle?.fontSize;
+```
+
+### Q17：TypeError 的产生场景
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（未定义变量操作） |
+| ✅ 正确答案 | B（将函数作为对象使用） |
+
+```js
+TypeError 的典型场景：
+undefined.foo        → ReferenceError（不是 TypeError！）
+fn()                 → TypeError（fn 不是函数却被当作函数调用）
+new undefined()      → TypeError
+'text'.split = 1     → TypeError（不可配置属性被修改）
+```
+
+> [!question] 💡 思考
+> 为什么访问 `undefined.xxx` 抛的是 `ReferenceError` 而不是 `TypeError`？
+
+### Q19：可继承的 CSS 属性
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（line-height） |
+| ✅ 正确答案 | C（border） |
+
+> [!memory] CSS 继承规则速记
+> 文本相关属性（color/font/line-height/letter-spacing）**默认继承**。
+> 盒模型属性（border/margin/padding/width/height）**不继承**。
+
+### Q20：选择器优先级
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（id） |
+| ✅ 正确答案 | A（style（行内样式最高）） |
+
+> [!memory] CSS 优先级从高到低
+> ```
+> !important > 行内 style > ID 选择器 > Class/属性/伪类 > 标签选择器 > 通配符
+> ```
+
+### Q26：querySelector 选择第一个 box 类元素
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C |
+| ✅ 正确答案 | C（document.querySelector('.box')） |
+
+> [!note] 纠正说明
+> 此题你答对了。注意：`.box` 中的点 `.` 表示类选择器，不加点 `box` 会被当作标签名 `<box>`。
+
+### Q30：事件委托中获得真实触发元素
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（target.name） |
+| ✅ 正确答案 | A（event.target.tagName） |
+
+### Q31：阻止事件冒泡
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（preventPropagation()） |
+| ✅ 正确答案 | B（event.stopPropagation()） |
+
+> [!warning] 避坑
+> DOM 规范中**不存在** `preventPropagation()` 这个方法。容易和 `preventDefault()` 混淆。
+
+### Q59：文件上传编码类型
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A |
+| ✅ 正确答案 | A（enctype="multipart/form-data"） |
+
+> [!note] 纠正说明
+> 此题你答对了。只有文件上传时需要 `multipart/form-data`；普通表单用默认的 `application/x-www-form-urlencoded` 即可。
+
+### Q73：操作浏览器地址栏的对象
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（navigator） |
+| ✅ 正确答案 | D（location） |
+
+> [!memory] BOM 四大对象区分
+> - **location**：URL 信息（搜索 `?`、哈希 `#`、跳转 `assign/replace`）
+> - **history**：历史栈（`back/forward/go`）
+> - **navigator**：浏览器信息（`userAgent/platform`）
+> - **screen**：屏幕尺寸
+
+### Q105：teleport 组件的理解
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B |
+| ✅ 正确答案 | C（可以条件性启用） |
+
+> [!abstract] teleport 的关键特性
+> - 传送的内容**保持与原组件的数据绑定**（响应式依然存在）
+> - 可以通过 `to` 属性指定任意合法选择器（不限于 body）
+> - 支持 `:disabled` 条件控制是否传送
+
+### Q107：Context 中修改 theme
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B |
+| ✅ 正确答案 | B（需要将 setTheme 也传入 Context） |
+
+> [!note] 纠正说明
+> 此题你答对了。Context 只传值不传方法，子组件就无法修改父组件的状态。正确做法是把 `[theme, setTheme]` 一起放入 value 对象。
+
+---
+
+## 五、存储与定时器
+
+### Q33：localStorage 的限制
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（存储任意类型） |
+| ✅ 正确答案 | A（不能存储任意类型） |
+
+> [!warning] localStorage 只能存**字符串**！
+> 存入对象/数组会自动调用 `.toString()` 变成 `[object Object]`。正确做法：
+> ```js
+> localStorage.setItem('data', JSON.stringify({ a: 1 }));
+> const parsed = JSON.parse(localStorage.getItem('data'));
+> ```
+
+### Q34：定时器描述的错误选项
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C |
+| ✅ 正确答案 | C（并非所有定时器都会立即执行） |
+
+`setTimeout(fn, 0)` 不代表立刻执行，而是放入宏任务队列等待本轮同步代码结束后再执行。
+
+### Q35：classList 切换类的方法
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C |
+| ✅ 正确答案 | C（toggleClass 不存在） |
+
+> [!note] classList 的正确 API
+>
+> | 方法 | 说明 |
+> |------|------|
+> | `add()` | 添加类 |
+> | `remove()` | 删除类 |
+> | `toggle()` | **切换**（有则删，无则加） |
+> | `contains()` | 是否包含 |
+> | `replace(old, new)` | 替换类名 |
+
+> [!warning] 注意区分
+> `toggleClass()` **不存在**于 DOM API 中，正确方法是 `classList.toggle()`（没有 Class 中间那个大写字母）。
+
+### Q108：自定义 Hook 的请求问题
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B |
+| ✅ 正确答案 | B（每次渲染都会发起请求） |
+
+```js
+// ❌ 错误：没有 useEffect 包裹
+function useData(id) {
+  fetch(`/api/data/${id}`).then(res => res.json()).then(setData);
+}
+
+// ✅ 正确：用 useEffect 控制时机
+function useData(id) {
+  const [data, setData] = useState(null);
+  useEffect(() => {
+    fetch(`/api/data/${id}`)
+      .then(res => res.json())
+      .then(setData);
+  }, [id]);  // 依赖 id 变化才重新请求
+}
+```
+
+---
+
+## 六、框架相关
+
+### Vue 专题
+
+#### Q01（provide/inject）& Q101
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A/C（父子通信 / props传递） |
+| ✅ 正确答案 | B（跨多层传递） |
+
+> [!abstract] provide/inject 适用场景
+>
+> ```mermaid
+> graph TD
+>   A["props drilling"] -->|"1-2层"| B["props 足够"]
+>   A -->|"3+层"| C["provide/inject 更优雅"]
+>   D["同层级兄弟"] --> E["提升状态到共同祖先"]
+>   F["全局共享"] --> G["Pinia / Vuex"]
+> ```
+
+#### Q102：reactive 解构导致响应式失效
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B |
+| ✅ 正确答案 | B（解构会丢失响应式追踪） |
+
+```js
+const state = reactive({ count: 0 });
+
+// ❌ 解构后失去响应式
+const { count } = state;   // count 变成了普通数字
+count++;                   // state.count 不变！
+
+// ✅ 正确做法
+const { count } = toRefs(state);  // toRefs 保留响应式
+count.value++;                   // 同步更新 state.count
+```
+
+#### Q103：生命周期执行顺序
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B |
+| ✅ 正确答案 | B（Child mounted → Parent mounted） |
+
+> [!abstract] 挂载顺序
+>
+> ```mermaid
+> flowchart LR
+>   A["父 setup 执行"] --> B["子 setup 执行"]
+>   B --> C["子 template 渲染"]
+>   C --> D["子 onMounted 执行"]
+>   D --> E["父 template 渲染"]
+>   E --> F["父 onMounted 执行"]
+> ```
+
+#### Q106：API Key 泄露处理
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B |
+| ✅ 正确答案 | B（在平台禁用并重新生成） |
+
+> [!note] 纠正说明
+> 此题你答对了。密码 ≠ API Key，更改密码无法撤销已泄漏的 Key。
+
+---
+
+### React 专题
+
+#### Q43（var 闭包）& Q44 & Q06 & Q14 & Q27：JavaScript 基础贯穿
+
+这几道题其实在考同一个内核：**JavaScript 的变量作用域和引用机制**。
+
+| 题目 | 考查点 | 你的答案 | 正确答案 |
+|------|--------|---------|---------|
+| Q43 | var 循环闭包 | D | A |
+| Q44 | Promise + setTimeout | D | A |
+| Q06 | 值传递 | A | A |
+| Q14 | 引用传递 | C | C |
+| Q27 | 引用赋值 | A | B |
+
+#### Q46：v-bind vs v-on
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（v-on） |
+| ✅ 正确答案 | A（v-bind（动态属性绑定）） |
+
+#### Q62：useState 的作用
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B（定义 props） |
+| ✅ 正确答案 | A（定义初始状态） |
+
+#### Q67：useEffect 清理副作用
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（useState） |
+| ✅ 正确答案 | A（返回一个函数） |
+
+#### Q70：React.memo 的作用
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（比较 refs） |
+| ✅ 正确答案 | A（比较 props，避免不必要重渲染） |
+
+#### Q72：子传父的实现方式
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（状态提升） |
+| ✅ 正确答案 | A（回调函数） |
+
+> [!question] 💡 思考
+> "状态提升"和"回调函数"有什么区别？什么场景该用哪个？
+
+#### Q84：触发重渲染的条件
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（useRef变化） |
+| ✅ 正确答案 | A（父组件状态变化） |
+
+> [!warning] useRef 的变化**不会**触发重渲染——这正是它的价值所在。
+
+#### Q98：浏览器原生支持的模块系统
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（CommonJS） |
+| ✅ 正确答案 | B（ESM） |
+
+```html
+<!-- 浏览器原生支持，通过 type="module" 开启 -->
+<script type="module" src="./app.js"></script>
+```
+
+CommonJS 是 Node.js 的规范，浏览器需要打包工具（Webpack/Vite）才能使用。
+
+#### Q99：ESM 中报错的导出语法
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（export *） |
+| ✅ 正确答案 | C（export = { a: 1 }） |
+
+---
+
+## 七、Node.js 与构建工具
+
+### Q09：浏览器页面加载事件
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A（DOMContentLoaded） |
+| ✅ 正确答案 | B（load（HTML + 所有外部资源）） |
+
+> [!abstract] 两个关键事件对比
+>
+> ```mermaid
+> timeline
+>   title 页面加载事件时间线
+>   HTML解析完成 ： DOMContentLoaded
+>   图片/CSS/JS加载完 ： load
+> ```
+
+### Q10：Node.js 能做什么
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | A |
+| ✅ 正确答案 | A（Node.js 不能操作 DOM） |
+
+### Q49：执行 HTTP 请求的 Node 模块
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（net） |
+| ✅ 正确答案 | A（http） |
+
+### Q50：FormData 添加键值对的方法
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（set()） |
+| ✅ 正确答案 | A（append()） |
+
+> [!warning] 注意区分
+> Map 对象用 `set()`，但 FormData 用 **`append()`**。两者 API 不同。
+
+### Q53-56：Webpack 配置项速查
+
+| 配置项 | 作用 | 你的答案 |
+|--------|------|---------|
+| devtool | 源代码映射 (sourcemap) | ❌ A |
+| externals | 定义外部依赖（不打包） | ✅ A |
+| splitChunks | 代码分割 | ✅ A |
+| resolve | 解析模块路径/别名 | ✅ A |
+| optimization | 优化打包 | ✅ C |
+
+### Q11：Node.js 内置模块
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D（dayjs） |
+| ✅ 正确答案 | D（dayjs（第三方库，非内置）） |
+
+### Q57-58：Node.js 基础
+
+| 题目 | 你的答案 | 正确答案 |
+|------|---------|---------|
+| module.exports | 导出公共接口 | ✅ A |
+| Node.js 是什么 | — | ✅ B |
+
+---
+
+## 八、其他知识点
+
+### Q28：自定义 data-* 属性
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | C（dataset 是函数） |
+| ✅ 正确答案 | D（dataset 返回 DOMMap 对象，不是函数） |
+
+### Q29：innerText vs innerHTML
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | D |
+| ✅ 正确答案 | D（两者作用不一致，innerHTML 解析标签） |
+
+> [!note] 纠正说明
+> 此题你答对了。`innerText` 只看纯文本，`innerHTML` 会解析并渲染 HTML 标签。
+
+### Q104：LLM 工作原理
+
+| 项目 | 内容 |
+| ------ | -------- |
+| ❌ 你的答案 | B |
+| ✅ 正确答案 | B（下一个 token 的最大似然预测） |
+
+> [!note] 纠正说明
+> 此题你答对了。LLM 不是"理解"语义，而是基于概率统计预测下一个词。
+
+---
+
+## 高频考点速览
+
+> [!summary] 测试中暴露的共性薄弱环节
+
+| 类别 | 高频考点 | 掌握要点 |
+|------|---------|---------|
+| 事件循环 | 同步/微任务/宏任务顺序 | 同步 → Promise.then → setTimeout |
+| JavaScript 基础 | 值传递 vs 引用传递 | 基本类型传副本，引用类型传指针 |
+| 事件系统 | stopPropagation / preventDefault | 冒泡 vs 默认行为，千万别混 |
+| CSS | 优先级 & 继承规则 | 行内 > ID > Class > 标签；文本继承，盒模型不继承 |
+| HTTP | 400/401/403/404/500 | 4x 客户端错，5x 服务端错 |
+| Axios | 拦截器最佳实践 | 优先路由跳转、先刷新 token |
+| Vue | provide/inject | 专为跨多层通信设计 |
+| Vue | reactive 解构 | 用 toRefs 保留响应式 |
+| React | useEffect 清理 | return () => cleanup |
+| React | 状态不可变性 | setList([newArr]) 而非 push+原引用 |
+| React | useRef | 不触发重渲染 |
+| 模块系统 | ESM vs CommonJS | 浏览器原生 ESM，export/import |
+| webpack | devtool | sourcemap 调试用，不是开发工具 |
+
+---
+
+## 关联笔记
+
+- [[hzh/EXAM]]
+- [[Frontend Fundamentals]]
+- [[JavaScript Event Loop]]
+- [[HTTP Status Codes]]
+- [[Vue Lifecycle]]
+- [[React Hooks Patterns]]