书单推荐 新书推荐 |
JavaScript 高级编程权威指南 读者对象:本书适用于希望突破技术瓶颈的中高级前端开发者、具备基础编程语法知识的学习者,以及需要系统建立JavaScript知识体系的跨语言开发者等,也可作为高等院校计算机或软件工程专业的师生用书和培训学校的教材。
本书系统介绍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
你还可能感兴趣
我要评论
|





