本书系统介绍JavaScript的主要机制与新特性。第1~4章剖析JavaScript的运行环境，揭示浏览器内核与V8引擎的运行原理。第5~12章介绍作用域与函数，涵盖闭包、this绑定、箭头函数、柯里化实践，以及apply()、call()与bind()三大函数方法。第13~16章通过对比对象创建方案、图解原型链关系的内存模型及寄生组合式继承方案，破解继承体系之间的矛盾。第17~25章解析ES6~ES15的特性变化，结合ECMAScript官方版本的迭代，辩证解读技术的演进过程。第26~29章介绍异步编程知识体系，从Promise手写实现、迭代器协议到async/await语法糖，并辅以事件循环时序图。第30~34章讲解工程实践，包括模块化方案选型，npm、pnpm与yarn生态对比，BOM与DOM操作规范，并手写防抖和节流函数、事件总线等生产级工具。本书适用于希望突破技术瓶颈的中高级前端开发者、具备基础编程语法知识的学习者，以及需要系统建立JavaScript知识体系的跨语言开发者等，也可作为高等院校计算机或软件工程专业的师生用书和培训学校的教材。

王红元，网名“Coderwhy”，前端领域大佬。担任广州市弘源科教软件有限公司CEO、澳大利亚The WAIN公司CTO，作为腾讯AI高校训练营的特聘讲师，曾为多所双一流高校授课。精通C/C++、Python、Java、Objective-C、Swift、JavaScript和TypeScript等多种编程语言。曾出版《Vue.js 3 + TypeScript完全指南》一书，获得大量读者好评。余辉程，阿里云专家博主、掘金优秀创作者，在掘金社区拥有数千粉丝。熟练掌握JavaScript、TypeScript、Vue.js、React、Vite、Node.js等前端技术栈。目前管理万人规模的前端社区，热衷于提升自身技能并为开源社区做出贡献。

1 邂逅JavaScript高级编程 1
1.1 前端开发需要掌握的三大技术 1
1.2 JavaScript的重要性 2
1.2.1 JavaScript的广泛应用 2
1.2.2 JavaScript中让人迷惑的知识点 4
1.3 TypeScript会取代JavaScript吗 4
1.3.1 JavaScript的发展历程 5
1.3.2 JavaScript是一门编程语言 5
1.4 编程语言之间的不同之处 6
1.4.1 机器语言 6
1.4.2 汇编语言 6
1.4.3 高级语言 6
后续预告 7
2 认识浏览器 8
2.1 浏览器的工作原理 8
2.2 认识浏览器内核 12
2.2.1 什么是浏览器内核 12
2.2.2 常见的浏览器内核 12
2.3 渲染引擎的工作流程 13
2.3.1 HTML文件的解析过程 14
2.3.2 生成CSS规则 15
2.3.3 构建渲染树 15
2.3.4 布局与绘制 16
2.3.5 回流与重绘 16
2.3.6 合成 18
后续预告 18
3 V8引擎的运行原理 19
3.1 认识JavaScript引擎 19
3.1.1 什么是JavaScript引擎 19
3.1.2 浏览器内核与JS引擎的关系 20
3.2 V8引擎的原理与处理流程 20
3.3 V8引擎的架构设计 23
3.4 V8的代码转化过程 25
3.4.1 词法分析的过程 26
3.4.2 语法分析的过程 27
3.4.3 转化的字节码 28
3.4.4 生成的机器码 29
后续预告 30
4 V8引擎的内存管理 31
4.1 认识内存管理 31
4.2 执行上下文栈 32
4.3 JavaScript引擎的执行过程 33
4.3.1 初始化全局对象 33
4.3.2 代码的执行过程 33
4.4 作用域链的查找规则 39
4.4.1 对作用域、作用域链的理解 39
4.4.2 AO、GO与VO、VE的区别 40
4.4.3 var缺陷 42
后续预告 43
5 作用域链面试题与垃圾回收 45
5.1 作用域链面试题 45
5.1.1 面试题1 45
5.1.2 面试题2 46
5.1.3 面试题3 48
5.1.4 面试题4 49
5.1.5 面试题5 49
5.1.6 作用域补充 49
5.2 JavaScript中的垃圾回收 50
5.2.1 内存的分配方式 50
5.2.2 常见的垃圾回收算法 51
后续预告 53
6 “一等公民”函数 55
6.1 什么是一等公民 55
6.1.1 函数是一等公民 55
6.1.2 封装函数案例 56
6.2 高阶函数 57
6.2.1 筛选偶数 57
6.2.2 函数与方法的区别 61
6.2.3 如何学习高阶函数 61
6.2.4 语法 62
后续预告 63
7 闭包 64
7.1 什么是闭包 64
7.1.1 闭包的定义 64
7.1.2 高阶函数的执行过程 65
7.1.3 闭包的本质 67
7.1.4 函数执行过程中的内存表现 69
7.1.5 闭包的执行过程 70
7.2 闭包的内存泄漏 73
7.2.1 闭包内存泄漏的解决方案 73
7.2.2 闭包内存泄漏案例 75
7.2.3 激活对象不使用的属性 78
7.3 JS闭包引用的自由变量销毁 79
后续预告 80
8 this指向及绑定规则、优先级 81
8.1 什么是this 81
8.1.1 为什么需要this 81
8.1.2 this在全局作用域中的指向 84
8.1.3 同一个函数的不同this指向 86
8.2 this的绑定规则 87
8.2.1 规则1：默认绑定 87
8.2.2 规则2：隐式绑定 90
8.2.3 规则3：显式绑定 92
8.2.4 规则4：new绑定 96
8.3 一些函数的this绑定 97
8.3.1 内置函数的绑定 97
8.3.2 setTimeout定时器 97
8.3.3 监听点击 98
8.3.4 数组中的绑定 98
8.4 this规则的优先级 100
8.5 特殊绑定 103
8.5.1 忽略显式绑定 103
8.5.2 间接函数引用 103
后续预告 105
9 箭头函数及this面试题 107
9.1 箭头函数 107
9.1.1 什么是箭头函数 107
9.1.2 箭头函数的使用 108
9.2 this面试题 115
9.2.1 面试题1 115
9.2.2 面试题2 116
9.2.3 面试题3 117
9.2.4 面试题4 118
后续预告 119
10 手写apply()、call()和bind()方法以及认识arguments对象 120
10.1 手写apply()、call()和bind()方法 120
10.1.1 call()方法的手写实现 121
10.1.2 为函数传递参数 122
10.1.3 ES6中的剩余参数 125
10.1.4 apply()方法的手写实现 126
10.1.5 手写call()和apply()方法的补充 127
10.1.6 bind()方法的手写实现 127
10.2 认识arguments 129
10.2.1 arguments转数组 129
10.2.2 数组中slice()方法的手写实现 130
10.2.3 箭头函数：无arguments 131
后续预告 132
11 纯函数及柯里化 134
11.1 理解JavaScript纯函数 134
11.1.1 副作用 135
11.1.2 纯函数的案例 135
11.1.3 纯函数的优势 136
11.2 JavaScript柯里化 137
11.2.1 柯里化的结构 137
11.2.2 柯里化的作用 138
11.3 理解组合函数 143
11.4 通用组合函数的实现 144
后续预告 145
12 with、eval和严格模式 146
12.1 JS碎片知识补充 146
12.1.1 with语句 146
12.1.2 eval函数 147
12.2 严格模式 147
12.2.1 严格模式的定义与应用 147
12.2.2 严格模式的限制 149
后续预告 152
13 对象和属性描述符 153
13.1 面向对象是现实的抽象方式 153
13.1.1 面向对象编程 153
13.1.2 JS中的面向对象 154
13.1.3 对象的数据属性描述符 155
13.2 Object.defineProperty()方法 155
13.2.1 属性描述符分类 157
13.2.2 学习属性描述符的意义 160
后续预告 161
14 对象方法的补充及创建对象方案 162
14.1 在对象上同时定义多个属性 162
14.2 对象方法补充 165
14.3 创建多个对象方案 166
14.3.1 创建对象方案：工厂模式 167
14.3.2 认识构造函数 169
14.3.3 创建对象方案：构造函数 170
后续预告 172
15 对象的原型 174
15.1 认识对象的原型 174
15.1.1 原型的定义 174
15.1.2 原型的作用 176
15.1.3 函数的原型prototype 177
15.1.4 new操作符 177
15.2 Person构造函数的原型内存图 178
15.3 函数原型上的属性 181
15.3.1 为prototype添加属性 181
15.3.2 constructor属性 182
15.4 重写原型对象 184
15.5 创建对象：构造函数和原型组合 187
后续预告 188
16 彻底攻克原型链 190
16.1 可枚举属性 190
16.2 类与对象 191
16.3 面向对象特性：继承 191
16.3.1 继承的重要性 192
16.3.2 JavaScript中的原型链 192
16.3.3 Object的原型 195
16.3.4 原型链关系的内存图 201
16.3.5 Object是所有类的父类 202
16.3.6 通过原型链继承 203
16.3.7 借用构造函数继承 206
16.3.8 原型式继承函数 209
16.3.9 寄生式继承函数 213
16.4 寄生组合式继承 215
16.5 对象的方法补充 218
16.6 原型继承关系 222
后续预告 224
17 ES6之class类与构造函数 225
17.1 ES6是什么 225
17.1.1 TC39技术委员会 225
17.1.2 Babel 227
17.2 定义类 228
17.2.1 函数的二义性 228
17.2.2 类的必要性 228
17.2.3 类的特点 229
17.3 在class类中定义构造函数和实例方法 230
17.3.1 类的构造函数 230
17.3.2 类的实例方法 231
17.3.3 类和构造函数的比较 233
17.3.4 类和对象的访问器方法编写 234
17.3.5 类中静态方法的定义 235
17.3.6 实例方法与静态方法的区别 236
后续预告 238
18 ES6的类与继承实现 239
18.1 类通过extends实现继承特性 239
18.2 super关键字 240
18.3 ES6转ES5代码 243
18.3.1 Babel 243
18.3.2 阅读源码的技巧 247
后续预告 247
19 ES6类的混入与解构 248
19.1 扩展继承内置类 248
19.2 类的混入 249
19.3 React中的高阶组件 252
19.4 多态 253
19.4.1 多态的定义 253
19.4.2 传统面向对象的多态 253
19.4.3 JavaScript中的多态 256
19.5 对象字面量 256
19.5.1 属性增强 256
19.5.2 方法增强 258
19.5.3 计算属性名 258
19.6 解构 260
19.6.1 数组解构 260
19.6.2 对象解构 262
后续预告 265
20 var的接替者：let与const 266
20.1 let和const的基本使用 266
20.2 let/const与window的关系 268
20.2.1 词法环境 270
20.2.2 块级作用域 270
20.2.3 暂时性死区 273
20.3 实际开发中的选择 274
后续预告 274
21 ES6的模板字符串与剩余参数 275
21.1 模板字符串的基本使用 275
21.2 函数默认参数 277
21.2.1 剩余参数 281
21.2.2 箭头函数 282
21.3 展开语法 283
21.3.1 对象的引用赋值、浅拷贝与深拷贝 285
21.3.2 数值的表示 286
后续预告 287
22 ES6的Symbol类型与Set、Map数据结构 288
22.1 Symbol的基本使用 288
22.1.1 Symbol值作为key 289
22.1.2 Symbol方法 291
22.2 数据结构Set 292
22.2.1 Set的基本使用 292
22.2.2 Set的常见方法 294
22.3 WeakSet的基本使用 295
22.3.1 WeakSet的常见方法 295
22.3.2 弱引用与强引用 296
22.3.3 WeakSet的应用场景 298
22.4 数据结构Map 299
22.4.1 Map的基本使用 300
22.4.2 Map的常见方法 301
22.5 WeakMap的基本使用 303
22.5.1 WeakMap的常见方法 304
22.5.2 WeakMap的应用场景 304
后续预告 305
23 ES7至ES15新特性详解 306
23.1 ES2016（ES7）新特性 306
23.1.1 Array.prototype.includes()方法 306
23.1.2 指数运算符 309
23.2 ES2017（ES8）新特性 309
23.2.1 Object.values()方法 309
23.2.2 Object.entries()方法 311
23.2.3 字符串填充 312
23.2.4 Trailing Commas 313
23.2.5 Object.getOwnPropertyDescriptors()方法 314
23.3 ES2018（ES9）新特性 314
23.4 ES2019（ES10）新特性 314
23.4.1 Array.prototype.flat()方法 314
23.4.2 Array.prototype.flatMap()方法 317
23.4.3 Object.entries()方法 319
23.4.4 String.prototype.trim()方法 320
23.4.5 其他知识点 321
23.5 ES2020（ES11）新特性 321
23.5.1 BigInt 321
23.5.2 空值合并运算符 322
23.5.3 可选链运算符 323
23.5.4 globalThis 323
23.5.5 for…in标准化 324
23.5.6 其他知识点 324
23.6 ES2021（ES12）新特性 324
23.6.1 FinalizationRegist 324
23.6.2 WeakRef 326
23.6.3 逻辑赋值运算符 327
23.6.4 其他知识点 328
23.7 ES2022（ES13）新特性 328
23.7.1 top-level await 328
23.7.2 新增类元素 329
23.7.3 静态代码块 330
23.7.4 #x in obj 语法 330
23.7.5 正则表达式匹配索引 331
23.7.6 cause 属性 331
23.7.7 String.prototype.at()方法 331
23.7.8 Object.hasOwn()方法 332
23.8 ES2023（ES14）新特性 332
23.8.1 Array和TypedArray的新方法 332
23.8.2 shebang 注释支持 335
23.8.3 在弱集合中将Symbol 作为键 335
23.9 ES2024（ES15）新特性 336
23.9.1 Object.groupBy()和Map.groupBy()静态方法 336
23.9.2 Promise.withResolvers()方法 336
23.9.3 集合运算方法 337
23.9.4 正则表达式标志 337
后续预告 338
24 Proxy与Reflect 339
24.1 监听对象的操作 339
24.2 Proxy的基本使用 341
24.2.1 handler.get()和handler.set()方法 342
24.2.2 Proxy(handler)的13个陷阱方法 343
24.3 Reflect的作用 345
24.3.1 Reflect的基本使用 347
24.3.2 Reflect的9个方法 347
24.3.3 Proxy与Reflect中的receiver参数 348
24.3.4 Reflect.construct()方法 354
后续预告 355
25 响应式原理 356
25.1 什么是响应式 356
25.2 响应式函数和依赖收集 357
25.2.1 依赖收集 358
25.2.2 监听对象变化 360
25.2.3 所有依赖的保存结构 362
25.2.4 正确收集依赖 366
25.2.5 对Depend类的优化与重构 370
25.3 响应式操作对比 374
25.3.1 Vue.js 3的响应式操作 374
25.3.2 Vue.js 2的响应式操作 376
25.3.3 React的响应式操作 376
后续预告 377
26 Promise 378
26.1 认识Promise 378
26.1.1 异步请求处理 378
26.1.2 Promise的基本使用 381
26.2 Promise的三种状态 386
26.3 Promise的executor函数参数 387
26.3.1 resolve回调函数 387
26.3.2 reject回调函数 388
26.3.3 thenable对象 389
26.4 Promise的实例方法 390
26.4.1 then()方法 391
26.4.2 catch()方法 394
26.4.3 finally()方法 399
26.5 Promise的静态方法 400
26.5.1 resolve()和reject()方法 400
26.5.2 all()和allSettled()方法 402
26.5.3 race()和any()方法 403
后续预告 405
27 手写Promise 406
27.1 Promises/A+规范介绍 406
27.2 then()方法和执行顺序 409
27.2.1 then()方法的优化 413
27.2.2 手写catch()方法 423
27.2.3 手写finally()方法 425
27.3 Promise的静态方法 427
27.3.1 手写resolve()和reject()方法 427
27.3.2 手写all()和allSettled()方法 427
27.3.3 手写race()和any()方法 429
27.4 Promises/A+规范测试 434
27.4.1 安装Promises/A+测试库 434
27.4.2 编写测试适配器 434
27.4.3 运行测试 435
后续预告 435
28 迭代器与生成器 436
28.1 什么是迭代器 436
28.1.1 可迭代对象 440
28.1.2 原生迭代器对象 444
28.1.3 可迭代对象的应用 444
28.1.4 自定义类对象可迭代性 448
28.2 什么是生成器 451
28.2.1 生成器的概念 452
28.2.2 生成器函数的执行流程 453
28.2.3 yield错位双向传递 457
28.2.4 生成器的其他方法 460
28.3 优化可迭代对象写法 462
28.3.1 迭代数字案例 463
28.3.2 自定义类对象优化 464
28.4 异步代码的处理方式 464
28.4.1 层层嵌套与链式调用 465
28.4.2 生成器方案 466
后续预告 468
29 async/await与事件循环队列 469
29.1 async/await 469
29.1.1 异步函数与普通函数的区别 469
29.1.2 async中的关键字await 472
29.1.3 async/await的解决方案 473
29.2 操作系统中的进程与线程 475
29.2.1 操作系统的工作方式 477
29.2.2 浏览器中的JavaScript线程 477
29.3 浏览器事件循环 478
29.3.1 什么是事件循环 478
29.3.2 宏任务与微任务 479
29.4 Promise执行面试题 480
29.4.1 面试题1 480
29.4.2 面试题2 482
29.4.3 面试题3 483
29.4.4 Node.js事件循环 488
后续预告 491
30 异常处理方案与JS模块化 492
30.1 异常处理 492
30.1.1 函数的异常处理方案 493
30.1.2 抛出异常的throw关键字 494
30.1.3 异常处理的具体方式 497
30.2 JS模块化详解 500
30.2.1 什么是模块化 500
30.2.2 JS模块化的历史 500
30.2.3 没有模块化带来的问题 502
30.2.4 CommonJS规范与Node.js的关系 503
30.2.5 AMD与CMD规范 513
30.2.6 ESM规范 516
30.2.7 ESM的解析流程 522
30.2.8 CommonJS与ESM相互引用 525
后续预告 526
31 包管理工具详解 527
31.1 npm包管理工具的作用与下载 527
31.1.1 代码共享方案 527
31.1.2 包管理工具npm 528
31.1.3 安装Node.js 528
31.1.4 依赖的版本管理 534
31.1.5 package中的配置补充 535
31.1.6 npm install命令 536
31.1.7 npm install的原理 537
31.1.8 npm的其他命令 541
31.2 包管理工具集合 543
31.2.1 yarn工具 543
31.2.2 cnpm工具 544
31.2.3 npx命令 545
31.2.4 pnpm工具 546
31.3 发布npm包 553
31.3.1 注册npm账号 553
31.3.2 终端发布npm包 555
31.3.3 修改包 556
后续预告 556
32 JSON序列化和数据存储 557
32.1 JSON的由来 557
32.1.1 JSON的基础语法 558
32.1.2 JSON序列化 559
32.2 初识Storage 566
32.2.1 localStorage和sessionStorage的区别 566
32.2.2 Storage的常见方法与属性 567
32.2.3 封装Storage 568
32.3 初识IndexedDB 570
32.3.1 IndexedDB连接数据库 570
32.3.2 IndexedDB数据库操作 571
32.4 初识Cookie 575
32.4.1 Cookie的常见属性 576
32.4.2 客户端设置Cookie 577
后续预告 578
33 BOM与DOM在现代开发中的应用 579
33.1 认识BOM 579
33.1.1 window全局对象 580
33.1.2 window窗口对象 580
33.1.3 window的常见属性 582
33.1.4 window的常见方法 583
33.1.5 window的常见事件 584
33.1.6 location对象的常见属性 585
33.1.7 location对象的常见方法 587
33.1.8 history对象的常见属性和方法 587
33.2 认识DOM和架构 588
33.2.1 Node节点 590
33.2.2 Document 592
33.2.3 Element 594
33.3 认识事件监听 596
33.3.1 事件流的由来 597
33.3.2 事件冒泡和事件捕获 597
33.3.3 事件对象event的常见属性与方法 599
后续预告 600
34 手写防抖和节流函数与自定义事件总线 601
34.1 认识防抖函数和节流函数 601
34.1.1 防抖函数 601
34.1.2 节流函数 603
34.2 第三方库实现防抖节流 604
34.3 手写防抖函数和节流函数 606
34.3.1 手写防抖函数 606
34.3.2 手写节流函数 614
34.4 自定义深拷贝函数 620
34.4.1 深拷贝的基本功能实现 620
34.4.2 其他类型处理 621
34.4.3 循环引用处理 623
34.5 自定义事件总线 625
尾声 628