系列文章目录

ES6中 对象字面量、解构赋值、var，let ，const、块及作用域、展开运算符与剩余参数相关知识点
ES6中 Map 集合类型知识点、常见使用场景、以及案例
ES6中 Set集合知识点、常见使用场景、以及案例
ES6中 迭代器与生成器，相关知识点、常见使用场景、以及案例
ES6中 Promise 相关知识点、常见使用场景、以及案例
ES6中 箭头函数、this的指向问题

ES7：includes()、指数运算符 详细教程
ES8：async/await、Object 的新静态方法、padStart/padEnd、函数参数列表末尾允许逗号 相关知识点
ES9：对象扩展与剩余参数运算符、异步迭代、Promise新增方法、模板字符串修订 相关知识点
ES10：数组扁平化、对象转换、字符串修剪、catch参数、Symbol描述文字、toString修、sort排序、标准化的globalThis 相关知识点
ES11：可选链操作符、空值合并运算符、allSettled、动态导入、matchAll、meta 相关知识点
ES12：逻辑赋值运算符、数字分隔符、replaceAll、Promise新方法、WeakRef、Setter/Getter 相关知识点
ES13：类私有属性和方法、顶层 await、at() 方法、Object.hasOwnProperty()、类静态块 相关知识点
ES14：数组的新“拷贝并修改”方法、findLast() 和 findLastIndex()、 Symbol 作为 WeakMap 的键 相关知识点
ES15：Object.groupBy() 和 Map.groupBy()、Promise.withResolvers() 相关知识点
ES16：Set 集合方法增强、Promise.try、迭代器助手、JSON 模块导入 相关知识

---

---

ES8（正式名称为 ECMAScript 2017）虽然发布已经有一段时间了，但它引入的特性非常经典，尤其是 async/await，直接改变了前端处理异步代码的游戏规则。

以下是 ES8 新增的核心知识点汇总：

---

一、async/await

这是 ES8 最重磅的更新。它让我们能用同步的写法来编写异步代码，摆脱了 Promise 的 .then() 链式调用。

详细知识点可以查看这篇 Promise的文章

二、Object 的新静态方法

ES8 对 Object 进行了增强，方便我们快速遍历对象或获取属性描述符。

方法	说明	示例
Object.values()	返回对象 自身所有 可枚举 属性值 的数组。	“Object.values({a: 1, b: 2}) // [1, 2]”
Object.entries()	返回对象 自身所有 可枚举 键值对 的数组。	“Object.entries({a: 1}) // [[‘a’, 1]]”
Object.getOwnPropertyDescriptors()	返回对象所有自身属性的描述符（包括 get/set）。	解决 Object.assign 无法正确拷贝 setter 的问题。

2.1 Object.values()：只拿“值”

当你不需要关心 key，只需要对对象里的所有内容进行求和、筛选或展示时，用它最快。

const inventory = {
  apple: 15,
  banana: 8,
  orange: 12
};

// 以前：需要用 Object.keys(inventory).map(key => inventory[key])
// 现在：直接拿 values 数组
const prices = Object.values(inventory); // [15, 8, 12]

const totalPrice = prices.reduce((sum, price) => sum + price, 0);
console.log(`总价是: ${totalPrice}`); // 总价是: 35

2.2 Object.entries()：键值对“全都要”

它会把对象转成一个 二维数组：[[key1, val1], [key2, val2]]。这让对象能够直接使用数组的各种高阶函数。

代码示例 A：配合 for…of 进行结构赋值
这是目前遍历对象最优雅的方式之一。

const userRoles = {
  admin: '系统管理员',
  editor: '内容编辑',
  guest: '访客'
};

for (const [role, description] of Object.entries(userRoles)) {
  console.log(`权限: ${role} -> 描述: ${description}`);
}
// 输出: 权限: admin -> 描述: 系统管理员 ...

进阶：对象与Map 的互相转换

Object.entries() 是连接 Object 和 Map 的桥梁

const obj = { x: 1, y: 2 };

// 1. Object -> Map
const map = new Map(Object.entries(obj));

// 2. Map -> Object (这是 ES10 的 Object.fromEntries)
const newObj = Object.fromEntries(map);

避坑指南：顺序问题

虽然在现代浏览器中，Object.values()和Object.entries()的返回顺序通常是稳定的，但如果你的对象键名包含数字，它们会按照数字从小到大排序，而不是定义顺序：

const strangeObj = {
  100: 'a',
  2: 'b',
  7: 'c'
};
console.log(Object.keys(strangeObj)); // ["2", "7", "100"]

三、字符串补全 (String Padding)

新增了两个方法用于在字符串的 头部或尾部 填充字符，直到达到指定长度。常用于日期格式化或对齐输出。

• padStart(targetLength, padString): 头部填充。

• padEnd(targetLength, padString): 尾部填充。

'8'.padStart(2, '0'); // "08"
'hello'.padEnd(10, '!'); // "hello!!!!!"

四、 函数参数列表末尾允许逗号

现在在定义或调用函数时，最后一个参数后面可以加逗号。

在编程语言（如JavaScript, Python, Rust, Go 等）中，在函数参数列表末尾允许逗号（Trailing Commas）看似是一个微小的视觉改动，但它实际上是为了 解决版本控制和代码维护 中的实际痛点。

4.1 引入末尾逗号这一功能的几个核心原因

更清晰的版本控制对比(Git Diff)

这是最主要的原因。如果没有末尾逗号，当你需要在列表末尾添加一个新参数时，你必须修改原来的最后一行（加上逗号），然后新起一行添加参数。

没有末尾逗号时： Git 会显示你改动了两行（删除旧行，增加两行）。

有末尾逗号时： Git 只会显示你增加了一行。这让Code Review（代码审查）变得极其高效，一眼就能看出实际逻辑改动在哪里。

减少语法错误

在频繁调整参数顺序或增删参数时，开发者经常会忘记在原本的最后一行补上逗号，导致语法报错。允许末尾逗号后，每一行的结构都是一致的：参数 + 逗号。你可以随意移动、复制或粘贴行，而不需要担心破坏语法结构。

代码示例(以JavaScript 为例)
以前的写法(不带逗号)
如果你想加一个age参数，你必须改动email那一行。

function createUser(
  name,
  email // 必须在这里手动补一个逗号，才能加下一行
) {
  // ...
}

现在的写法(带末尾逗号)
无论你是否要添加新参数，末尾的逗号都可以存在。

// 函数定义
function createUser(
  name,
  email,
  location, // 末尾逗号
) {
  console.log(name, email, location);
}

// 函数调用
createUser(
  "张三",
  "zhangsan@example.com",
  "北京", // 这里的逗号让未来增加参数变得极其简单
);