跳到主要内容

Eloquent JavaScript 4e 拆解大纲(14 章)

切分原则:按推理链切,不按字数;语言部分基本对齐原书章;Ch2+Ch3 合并为「程序的形状」; Ch7(机器人)与 Ch12(Egg)两个项目章合并为一章「两台样机」并前移(它们只依赖前六章); 浏览器部分按「显示与交互 / 画图与通信 / 服务器端」三段收拢。原书练习与附录提示不逐条拆解。2026-08-27 复审后补:平台游戏项目章升为独立的第 15 章(此前并入 12 章的声明落空)。

  • 01-ladder-of-language.md(Introduction) 进来时以为「学 JS = 背语法」→ 出去时知道:同一件事可以在四个高度表达(机器码→英文指令→带标签伪代码→两行调用),语言的价值是让你在高的高度说话;JS 从 1995 年浏览器插件长成通用语言,它的「来者不拒」既是事故之源也是自由之源。
  • 02-values-and-types.md(Ch1 Values, Types, and Operators) 进来时以为「数字就是数字」→ 出去时知道:机器世界里只有比特块;64 位浮点的精度边界(9 千兆整数内精确、小数只是近似);字符串按 16 位单元存(emoji 占两位);JS 会偷偷替你转类型(coercion),=== 是防御工事;|| 与 ?? 差在「把 0 当不存在吗」。
  • 03-program-shape.md(Ch2 Program Structure + Ch3 Functions) 进来时以为「程序=一行行命令」→ 出去时知道:表达式/语句/side effect 之分;binding 是触手不是盒子;作用域由文本位置决定(词法);函数值=代码+出生环境(闭包);调用栈与爆栈;递归的代价(约 3 倍慢)与「先写对再测量」;农场库存案例示范函数怎么长出来;纯函数为何好测。
  • 04-data-structures.md(Ch4 Data Structures: Objects and Arrays) 进来时以为「存数据=一摞变量」→ 出去时知道:数组与对象怎么组织数据(下标=要跳过的个数;对象=有名字的触手的章鱼);身份与内容的区别(== 不比内容);狼人松鼠主走查——phi 系数把 90 天日志算成「花生+不刷牙」;可变性 vs 持久;JSON 是唯一的随身行李格式。
  • 05-higher-order-functions.md(Ch5 Higher-Order Functions) 进来时以为「函数只能被调用」→ 出去时知道:函数是值,可以当参数传;高阶函数=抽象「动作」;filter/map/reduce 三板斧与管道式组合;抽象的真实代价(中间数组);Unicode/UTF-16 为什么让 length 不可信;countBy/textScripts 的分人群统计。
  • 06-secret-life-of-objects.md(Ch6 The Secret Life of Objects) 进来时以为「面向对象=写 class」→ 出去时知道:JS 的对象靠原型链找属性;class 是 2015 年的语法糖;this 是特殊传入的参数(箭头函数不绑);多态=面向接口编程;Map 该用 Map(普通对象当映射会被 toString 污染);迭代器协议;作者的判断——继承比封装/多态更有争议。
  • 07-two-machines.md(Ch7 Project: A Robot + Ch12 Project: A Programming Language) 进来时以为「学完语法就该背框架」→ 出去时知道:两个项目示范「把抽象拼成能跑的系统」——机器人:把世界压成最小状态、每次移动算新状态、三代机器人从随机走到广度优先寻路;Egg:文本→语法树→求值器不到 150 行,if 为什么必须是特殊形式,以及「编译=提前做功」与 DSL 的价值。
  • 08-bugs-and-errors.md(Ch8 Bugs and Errors) 进来时以为「bug 靠运气修」→ 出去时知道:错误分「想法错」与「转译错」;strict mode 把静默错误变响;类型系统与 TypeScript;自动测试是超能力;调试方法论=理论→观察(numberToString 走查);异常=沿调用栈的跳楼+梯子(finally),选择性捕获要用 instanceof 而不是比消息;断言为程序员错误服务。
  • 09-regular-expressions.md(Ch9 Regular Expressions) 进来时以为「正则是天书」→ 出去时知道:正则=一套描述字符串模式的微型语言,引擎把它当流程图跑、走不通就回溯;灾难性回溯的成因;贪婪与非贪婪(去注释案例);replace+分组+函数替换;$1 的力量;lastIndex 共享陷阱;\p 与 u 旗标;INI 解析实战与 ^$ 锚定。
  • 10-modules-and-packages.md(Ch10 Modules) 进来时以为「代码写一个文件里就行」→ 出去时知道:纠缠(big ball of mud)的两种恶果;模块=接口+依赖;ES modules 与 CommonJS 的分野(import 运行前解析 vs require 运行中调用);NPM/语义化版本/^2.3.0;打包与压缩的存在理由;模块设计:专注、算值、跟别人的数据结构走。
  • 11-asynchronous-programming.md(Ch11 Asynchronous Programming) 进来时以为「程序从头跑到尾」→ 出去时知道:JS 的等待是显式的;回调的传染性;promise=尚未到手的收据,链上任一环失败全链拒绝;async/await=伪同步糖(本质是生成器);事件循环=单线程大循环,慢代码会拖住一切;Carla 破译密码与 fileSizes 的 += 缺口走查。
  • 12-browser-and-events.md(Ch13 JavaScript and the Browser + Ch14 The Document Object Model + Ch15 Handling Events) 进来时以为「网页=一张静态纸」→ 出去时知道:浏览器是什么(协议栈/沙箱/浏览器战争);HTML 被解析成一棵活树(DOM),改树即改屏幕;布局与 CSS 的层叠;事件从叶子往根传播、可拦可放;防抖与 rAF 动画;live 列表与 layout thrashing 这两个真实的坑。
  • 13-canvas-http-and-forms.md(Ch17 Drawing on Canvas + Ch18 HTTP and Forms + Ch19 Project: A Pixel Art Editor) 进来时以为「画图=摆 DOM 方块」→ 出去时知道:SVG 保留形状、canvas 只剩像素——选型要看改谁;路径/变换/精灵图;fetch 与同源策略;表单字段与本地存储;像素编辑器项目把「单一状态+action 通道」的界面架构、撤销史(1 秒阈值)完整走一遍。
  • 14-node-and-skill-sharing.md(Ch20 Node.js + Ch21 Project: Skill-Sharing Website) 进来时以为「JS 只能活在浏览器里」→ 出去时知道:Node 选 JS 恰因为 JS 没有内建 I/O;fs/http/流三板斧;文件服务器实战(路径安全、幂等删除);长轮询=扣着响应不发(ETag 挪用),这正是 Node 的设计动机;最终项目把全书技术拧成一台全栈机器。

自查(两条「出去时知道」是否同一件事)​

  • 02 与 05:02 管「值本身怎么存」,05 管「函数怎么当值用」——不同。

  • 04 与 05:04 的走查是 phi 系数(数据组织+统计),05 的走查是 textScripts(高阶组合)——不同。

  • 06 与 07:06 是对象机制本身;07 是两个项目(状态压缩+解释器)——不同。

  • 08 与 09:08 管程序出错后怎么办;09 管文本模式匹配——不同。

  • 12 与 13:12 的落点是「网页怎么显示、怎么响应用户」;13 的落点是「怎么画图、怎么跟服务器说话、状态怎么管理」——协议细节只在一处主讲(13 讲 HTTP/fetch,12 只交代浏览器存在于什么网络上),不重复。

  • 13 与 14:13 全在浏览器一侧;14 全在服务器一侧——不同。

  • 01 与 03:01 讲「为什么要语言」(阶梯),03 讲「语言给了什么形状」(语句/函数)——不同。

  • 15-platform-game.md(Ch16 Project: A Platform Game;复审后新增) 进来时以为「游戏=一个循环加一堆 if」→ 出去时知道:关卡=字符画,世界状态=level+actors+status 且每步造新 State;一帧之内先横后纵解碰撞(进墙取消整个动作,靠 100 毫秒帧上限兜底);显示层背景画一次、演员每帧重画,镜头留 1/3 中性区。