第 4 章 JavaScript 基础与进阶：数据类型、闭包、作用域、原型链、异步编程
本章聚焦 JS 核心概念的面试高频考点，从底层原理到工程实践，帮你构建可复用的回答框架。通过 3 个问答卡片 + 1 个真实项目模板，覆盖最易踩坑的面试题。
图：JavaScript 进阶面试回答框架 —— 从五个核心维度构建回答逻辑
知识结构速览
| 主题 | 核心要点 | 常见考点 |
|---|---|---|
| 数据类型 | 基本类型（7种） + Object；typeof vs instanceof | null 类型判断、数组判断、类型转换 |
| 闭包 | 函数 + 外部变量引用；自由变量保持 | 闭包定义、使用场景（模块化/柯里化）、内存泄漏 |
| 作用域 | 全局/函数/块级作用域；作用域链 | 变量提升、暂时性死区、let/const 与 var |
| 原型链 | __proto__、prototype、constructor；继承方式 | 原型链查找、instanceof、ES6 class 本质 |
| 异步编程 | 回调 → Promise → async/await；事件循环 | 宏任务/微任务、手写 Promise、错误处理 |
面试问答卡片
如何判断一个变量是否为数组？有哪些方式？
面试官考察点：数据类型判断的准确性、边界情况认知、对 ES6 新方法的掌握。
回答框架：列出核心方法 → 区分优缺点 → 给出推荐用法
示例回答：常用四种方法：
Array.isArray(arr)（推荐）、arr instanceof Array（可能跨 iframe 失效）、Object.prototype.toString.call(arr) === '[object Array]'（最可靠）、arr.constructor === Array（可被修改）。优先使用 Array.isArray。可能追问：typeof null 为什么是 'object'？如何判断一个变量是否为 NaN？
避坑提醒：instanceof 在跨窗口/跨 iframe 时会失效，注意全局执行上下文差异。
什么是闭包？请举例说明闭包的实际应用场景。
面试官考察点：是否理解闭包本质、能否联系工程实践、内存泄漏意识。
回答框架：定义 → 原理 → 场景（至少 2 个） → 注意事项
示例回答：闭包指函数能访问外部函数中变量的能力。常见场景：数据私有化（如计数器）、函数柯里化（如
const add = x => y => x + y）、防抖/节流函数。注意闭包引用的外部变量不会被 GC，可能造成内存泄漏，需手动释放。可能追问：闭包中的 this 指向问题？如何解决循环引用导致的内存泄漏？
避坑提醒：别只说理论，一定要结合真实业务举例（如 React Hooks 中的闭包陷阱）。
说说你对 Promise 的理解，以及 async/await 解决了什么问题？
面试官考察点：异步流程控制能力、错误处理、事件循环基础。
回答框架：回调地狱 → Promise 三种状态 → 链式调用 → async/await 语法糖
示例回答：Promise 是异步操作的结果对象，有 pending/fulfilled/rejected 三种状态，通过
.then/.catch 链式避免回调嵌套。async/await 是基于 Promise 的语法糖，让异步代码看起来像同步，本质是 Generator + Promise 的封装。注意 await 必须在 async 函数中使用。可能追问：手写 Promise.all？宏任务与微任务的执行顺序？async 函数中 reject 怎么捕获？
避坑提醒：不要在 forEach 中直接使用 await，应使用 for...of 或 Promise.all。牢记微任务先于宏任务执行。
项目案例 · 真实模板
Project：复杂表单动态校验 & 异步数据联动模块
| 业务背景 | 内部中后台系统，表单包含 30+ 字段，依赖多个异步 API（省市区联动、用户权限校验）。 |
|---|---|
| 规模指标 | 表单组件 12 个；校验规则 50+；日均请求 2000+；首次加载 < 800ms。 |
| 技术栈 | React 18 + TypeScript + Redux Toolkit + Axios + 自定义 hooks |
| 核心难点 |
|
| 面试高频追问 |
|
| 可迁移回答话术 | “我使用自定义 useAsyncValidation hook，内部基于 useEffect + AbortController 处理竞态；核心逻辑：每次值变化时生成新 AbortController，之前请求被自动取消，避免老 response 覆盖新状态，同时 300ms 防抖减少无效请求。对于数据格式不一致，我在 service 层统一做 adapter 映射，表单层只消费标准化结构。” |
💡 面试加分：在回答异步校验时，主动提及 AbortController + 防抖的组合，能体现你对工程化竞态控制的深入思考。
提示：本章所有问答框架均可套用“概念 → 原理 → 场景 → 注意点”的四段结构，组织回答逻辑更清晰。