{"name":"JavaScript","id":"编程语言-JavaScript-JavaScript","content":"# JavaScript\n\n## 一、JavaScript 的第一性原理\n\n### 1.1 语言诞生背景与核心约束\n\nJavaScript 并非为“构建大型系统”而生，而是为了解决浏览器中的三个现实约束：\n\n1. **环境不可信**：运行在用户浏览器，代码随时可能中断\n2. **开发者水平参差**：需要极低的入门门槛\n3. **交互驱动**：以事件为核心，而非批处理计算\n\n由此决定了 JavaScript 的核心设计取向：\n\n> **容错优先于严谨，可运行优先于完全正确**\n\n这也是理解 JS 所有“怪异行为”的总钥匙。\n\n---\n\n## 二、值模型（Value Model）\n\n### 2.1 值语义与引用语义\n\nJavaScript 从根本上区分两类值：\n\n* **原始类型（Primitive）**：值语义\n* **对象类型（Object）**：引用语义\n\n这并非内存结构的区分，而是**语义层面的复制规则**：\n\n* 值语义：复制即拷贝值本身\n* 引用语义：复制的是“访问路径”\n\n> “栈 / 堆”只是实现细节，不是语言语义\n\n### 2.2 原始类型体系\n\nJavaScript 的原始类型包括：\n\n* Undefined：未绑定值的占位符\n* Null：有意为空的语义标记\n* Boolean：逻辑判断的最小闭包\n* String：UTF‑16 编码的有序字符序列\n* Number：IEEE‑754 双精度浮点数\n* Symbol：用于构建**非字符串命名空间**的唯一标识\n\n#### Number 的工程含义\n\n* JS 没有整数类型\n* 所有数值均为浮点数\n* 精度边界是语言的**内在限制，而非实现缺陷**\n\n因此：\n\n> JavaScript 不适合做高精度数值计算，除非引入专用抽象（BigInt / Decimal）\n\n---\n\n## 三、类型系统与转换规则\n\n### 3.1 动态类型的本质\n\nJavaScript 是**运行期绑定类型**的语言：\n\n* 变量无类型\n* 值才有类型\n\n这带来的不是“灵活”，而是：\n\n> **类型错误被延迟到运行期暴露**\n\n### 3.2 ToPrimitive 抽象操作\n\n对象参与运算前，必须被转换为原始值：\n\n1. 调用 valueOf\n2. 再调用 toString\n\n这是 JavaScript 所有隐式转换的底层机制。\n\n### 3.3 相等性模型\n\n`==` 的存在不是偶然，而是为了：\n\n* 降低新手心智负担\n* 允许跨类型“勉强可用”的比较\n\n但工程实践证明：\n\n> 其不可预测性远大于便利性\n\n因此现代工程规范中：\n\n* **禁止 `==`**\n* **统一使用 `===`**\n\n---\n\n## 四、执行模型与控制流\n\n### 4.1 作用域与执行上下文\n\nJavaScript 的执行以**函数调用**为边界：\n\n* 每次调用都会创建新的执行上下文\n* 上下文通过作用域链访问外部变量\n\n### 4.2 控制流语句的设计哲学\n\nif / for / while 并不特殊，它们只是：\n\n> **条件驱动的执行路径选择器**\n\n理解这一点，比记住语法形式更重要。\n\n---\n\n## 五、语法容错机制（ASI）\n\n### 5.1 自动分号插入的设计动机\n\nASI 的目标只有一个：\n\n> **让不完整的代码尽可能继续执行**\n\n代价是：\n\n* 语义偶尔违背直觉\n* 可读性下降\n\n### 5.2 no LineTerminator here 的本质\n\n这些规则并非“怪癖”，而是为了保证：\n\n* 语法树仍然可被唯一解析\n\n工程实践结论：\n\n> **始终显式写分号，避免依赖 ASI**\n\n---\n\n## 六、对象系统与内建抽象\n\n### 6.1 对象的本质\n\nJavaScript 的对象不是“类的实例”，而是：\n\n> **一组可动态扩展的键值映射**\n\n原型链只是对象复用的一种机制。\n\n### 6.2 函数是一等对象\n\n函数的本质不是“代码块”，而是：\n\n* 可调用\n* 可传递\n* 可组合的对象\n\n这使得：\n\n* 回调\n* 高阶函数\n* 控制反转\n\n成为语言的自然能力。\n\n---\n\n## 七、工程模型示例：动画系统\n\n动画的抽象模型是：\n\n```\n时间 → 状态变化 → 渲染\n```\n\nsetInterval 只是其中一种时间源，并非动画本身。\n\n现代实践中，应优先使用：\n\n* requestAnimationFrame\n\n以对齐浏览器的渲染节奏。\n\n---\n\n## 八、宿主环境与边界意识\n\n### 8.1 ECMAScript vs 浏览器 API\n\n必须明确区分：\n\n* 语言标准（ECMAScript）\n* 宿主能力（DOM / Window / Storage）\n\n混淆两者会导致错误的技术判断。\n\n### 8.2 本地存储的工程边界\n\nlocalStorage / sessionStorage：\n\n* 不是数据库\n* 没有事务\n* 不保证安全性\n\n> 只能用于**低价值、可丢失的数据缓存**\n\n---\n\n## 九、语言演进与现代实践\n\nJavaScript 的发展史是一部**兼容性妥协史**。\n\n因此现代工程应：\n\n* 使用 let / const\n* 禁用 eval\n* 引入类型系统（TypeScript）\n* 借助工具弥补语言缺陷\n\n---\n\n## 十、总结：如何正确\"使用\"JavaScript\n\n> 不要把 JavaScript 当作\"设计严谨的语言\"，\n> 而要把它当作：\n>\n> **一门需要工程纪律约束的灵活工具**\n\n理解其原理，才能驾驭其不完美。\n\n## 关联内容（自动生成）\n\n- [/编程语言/JavaScript/Vue.md](/编程语言/JavaScript/Vue.md) Vue 作为基于 JavaScript 的前端框架，体现了声明式、响应式、组件化等现代前端架构思想，是对 JavaScript 语言能力的高层次封装和工程化实践\n- [/编程语言/JavaScript/Node/NodeJs.md](/编程语言/JavaScript/Node/NodeJs.md) Node.js 基于 JavaScript 实现了服务端运行环境，通过事件驱动和非阻塞 I/O 模型扩展了 JavaScript 的应用场景，展现了 JavaScript 在服务端的工程化潜力\n- [/编程语言/typescript.md](/编程语言/typescript.md) TypeScript 为 JavaScript 提供了可选的静态类型系统，在不改变 JavaScript 运行时的前提下提升了代码的可维护性和工程化能力，是解决 JavaScript 动态类型缺陷的有效方案\n- [/中间件/浏览器/V8.md](/中间件/浏览器/V8.md) V8 是 JavaScript 的高性能引擎实现，理解其对象内存布局、运行时、字节码执行和优化机制有助于更好掌握 JavaScript 的性能特点和优化策略\n- [/编译原理/编译原理.md](/编译原理/编译原理.md) JavaScript 的解释执行和即时编译（JIT）机制体现了经典的编译原理，包括词法分析、语法分析、字节码生成、优化编译等阶段\n- [/中间件/浏览器/浏览器.md](/中间件/浏览器/浏览器.md) 浏览器是 JavaScript 的主要宿主环境之一，提供了 DOM、BOM 等 Web API，理解浏览器工作机制有助于更好地使用 JavaScript 进行前端开发\n- [/软件工程/架构/Web前端/前端工程化.md](/软件工程/架构/Web前端/前端工程化.md) JavaScript 项目的工程化实践包括模块化、构建、测试、部署等环节，是实现大规模项目可维护性的重要保障\n- [/软件工程/架构/Web前端/Web前端.md](/软件工程/架构/Web前端/Web前端.md) JavaScript 是现代前端开发的核心技术之一，与 HTML、CSS 共同构成前端技术栈，理解前端架构有助于全面掌握前端开发生态\n","metadata":"tags: ['编程语言', '计算机系统', '工程化']","hasMoreCommit":true,"totalCommits":25,"commitList":[{"date":"2026-02-12T14:07:03+08:00","author":"MY","message":"doc: 整理标签","hash":"290b3e8ad18f48832ac282290238d020fc030a88"},{"date":"2025-12-16T18:06:52+08:00","author":"MY","message":"docs(javascript): 重构 JavaScript 文档结构与内容","hash":"f6e32b29e17b69fd639c9b88520e447d7c14f3c5"},{"date":"2022-10-13T16:56:30+08:00","author":"cjiping","message":"✏️js","hash":"7e8f206a15db74dc7af4ecd23cb0332fa735c27f"},{"date":"2022-06-28T17:22:50+08:00","author":"cjiping","message":"✏️更新 JavaScript","hash":"6f2940a03d5f95f085da15e5c37b0a07d502959b"},{"date":"2022-06-24T16:49:12+08:00","author":"cjiping","message":"✏️更新 JavaScript","hash":"b6acfb9f3d904dd46d667f03e983083d9668ba62"},{"date":"2022-06-23T15:22:07+08:00","author":"cjiping","message":"✏️更新 JavaScript","hash":"b20858909ce1750ade8d4e269b0ac11e819650ef"},{"date":"2020-02-29T12:22:36+08:00","author":"MY","message":"JS增加正则表达式","hash":"92171dbdea1b4c5a9da80a22abf11a885336abcf"},{"date":"2020-02-14T21:53:58+08:00","author":"MY","message":"完成笔记结构重构","hash":"fa76a092bde3bf674471ba101d7e1d1dd2c7108b"},{"date":"2020-01-30T14:36:11+08:00","author":"MY","message":"JS增加本地存储","hash":"836ed47ac31f2c9695edd3f85cc8f9cffb775d12"},{"date":"2020-01-30T14:20:31+08:00","author":"MY","message":"增加JS常用插件及框架","hash":"fafb627cd0f4d1f9d2cd7dc9d764a347bb17a59d"}],"createTime":"2019-08-07T11:59:00+08:00"}