JavaScript 语言编程进阶--掘金小册课程推荐/优惠

作者介绍

Yanni4Night，资深前端工程师。专注于前端超过 10 年时间，从 IE6 时代就曾经涉足自研构建工具，在 2013～2014 年曾建设过多个低代码工具，为业务提效。后在百度先后负责贴吧客户端 Hybrid 架构的重建和手百 React Native 业务的开发和管理。某年度 InfoQ 前端总结特约作者。

目前在某短视频公司负责 B 端业务，致力于微前端框架的研发和业务应用，某平台上 React Hooks 相关视频课程讲师，对于 ECMAScript 规范原理有深入的理解和思考，热衷于打造具有扎实基础知识的技术团队。

小册介绍

JavaScript 是大前端领域最需要掌握的编程语言，甚至人言前端工程师就是 JavaScript 工程师。虽比较片面，但也能说明其重要性。

作为动态脚本语言，JavaScript 上手起来并不难，简单安装一个 Node.js 就可以了，甚至在浏览器的控制台就能运行，其声明变量、函数调用、加减乘除等等，全都没有特殊的语法。

然而随着开发进程的深入，你逐渐用到更多的语言特性，比如类型判断、字符串处理、class 声明、类型转换、原型链、迭代遍历等等，就会发现总有这样或者那样的特例需要处理；或者你写的业务代码总是不够健壮，你就很容易迷茫：到底怎样写才能实现生产环境可用的足够健壮和高效的代码？

的确，JavaScript 存在很多“陷阱”，如果你不能正确处理这些 case，那么你仍然只是一名处于入门水平的初级工程师，甚至不能保证业务代码的健壮性。也说明你对这门语言仍然不足够了解。

本小册总结了我近十年来一线业务开发的 JavaScript 编码经验。我毕业后经历的第一个语言版本更新是 ES2015（即 ES6），自此我开始热衷于跟踪每年的新发布，有哪些新的特性被加入进来，有什么使用场景，还有哪些特性被废弃或者发生 breaking change。

这些经验如果靠自己一个人去积累，那么一定会需要相当长的时间，甚至踩相当多的坑。比如：

• 为什么有些字符明明是一个字，但是其 length 属性却是 2，甚至是 7？
• 为什么数组的 indexOf 函数找不到 NaN？
• 为什么日期对象能转换成数字，而普通对象却是 NaN？
• Vue 是如何实现对数据变更的监控的？
• ……

本小册希望能帮助你绕过这些弯路，从语言能力的层面上快速上升一个台阶，把精力去放在建设 level 等级更高的业务抽象上。

为了达成这一目标，我以 ECMA262 规范的内容作为佐证，配合具体的可执行代码案例，来说明其背后的规律和原理。

比如，一个字符表情（Emoji）的结构本质是什么样的，它将如何影响字符串的行为：

再比如，有那么多对象的遍历方法，它们的特点和不同都是什么：

当然，我并不会教条地去直接翻译 ECMA262，规范包含的信息量非常大，而我们日常使用的只是其中一部分，出于效率的考虑，我仍然会从一般互联网公司的常用需求出发，配合 ECMA262，为大家讲解 JavaScript 一些行为的原理和结构，这里面有我们日常最常用的对象类型的操作，也包括一些日常总是拿不准的高级 API 的用法。相信大家在完成学习后，一定有种豁然开朗的感觉。

本小册的主要内容大致分为以下 三大模块。

• 基础篇：日常最最常用的数据类型的使用知识，侧重点在于最佳操作 API 的选择，潜在陷阱的梳理。
• 进阶篇：常用操作、数据结构的原理性梳理，侧重点在使用高级 API 提升常见需求的效率和健壮性。
• 高级篇：掌握实现特殊需求的必备手段，清楚环境对运行结果的影响，做到开发和运行效率的极致优化。

以下是小册结构的思维导图：

这是一个循循渐进的结构，小册将从最简单的数据类型开始，逐渐引导至日常接触的运行环境，过程中涵盖了 ECMA262 规范中涉及一线编程能力的大部分知识，相信你在学习过程中一定能体会到依照规范重新认识一门语言的重要性，其中涉及的细节正是体现了一名工程师水平高低、能力优劣的关键。

你会学到什么？

• ✅从规范层面理解 JS 底层逻辑，夯实前端基础；
• ✅深度梳理 API 间的关系，日常使用更有信心；
• ✅掌握提升效率的高级写法，比别人更快一步；
• ✅重识常用 JS 数据结构，调试开发信手拈来。

适宜人群

1. 初步接触前端的小白，想进一步提升自己的 JavaScript 基础能力，向高级工程师的角色跃进；
2. 需要跨界开发前端技术栈的其他角色，比如后端、客户端，为自己的不可替代性添加实力筹码。

• 基础篇｜掌握最独特的数据类型：Symbol

• 开篇｜你真的熟悉 JavaScript 吗？

• 基础篇｜字符串：揭开字符序列的深层奥秘

• 基础篇｜隐式类型转换：不同类型的数据是如何一起工作的？

• 基础篇｜如何合理地判断变量的类型？

• 基础篇｜最常见的对象操作方法

• 基础篇｜如何高效地创建、遍历与搜索数组？

• 基础篇｜JS 对象的基本结构是什么？

• 基础篇｜高效、优雅地利用正则表达式

• 基础篇｜对象遍历的不同方法和适用场景

• 进阶篇｜你不知道的 JSON 那些事

• 进阶篇｜如何理解索引集合与键值集合？

• 基础篇｜函数：千变万化的特殊对象

• 高级篇｜如何理解全局对象？

• 进阶篇｜错误处理：保持健壮性的护城河

• 进阶篇｜反射：Reflect 提供了哪些访问对象的高级能力？

• 进阶篇｜高级异步：如何避免写出回调地狱？

• 进阶篇｜代理（Proxy）：响应式数据的终极实现手段

• 高级篇｜ESM 是如何实现代码可复用性的？

• 高级篇｜strict 模式是怎样影响代码运行结果的？

• 应用篇｜重新认识浏览器下常见的 JS 对象

• 尾声｜编写健壮、高效的 JS 代码

• 进阶篇｜不只是文本，JS 也能处理二进制数据

• 基础篇｜作用域：变量的可访问性原理

• 进阶篇｜一文掌握时间日期的高级操作

• 高级篇｜如何提前使用 JavaScript 最新特性？

• 基础篇｜从 class 语法视角看类的继承与实例创建

• 高级篇｜理解事件循环中的宏任务与微任务

• 应用篇｜编写一个沙盒 SDK（一）

• 应用篇｜编写一个沙盒 SDK（二）