背景

去年下半年，我在微信书架里加入了许多技术书籍，各种类别的都有，断断续续的读了一部分。

没有计划的阅读，收效甚微。

新年伊始，我准备尝试一下其他方式，比如阅读周。每月抽出1~2个非连续周，完整阅读一本书籍。

这个“玩法”虽然常见且板正，但是有效，已经坚持阅读三个月。

4月份的阅读计划有两本，《你不知道的JavaScrip》系列迎来收尾。

已读完书籍：《架构简洁之道》、《深入浅出的Node.js》、《你不知道的JavaScript（上卷）》、《你不知道的JavaScript（中卷）》。

当前阅读周书籍：《你不知道的JavaScript（下卷）》。

ES6之后

异步函数

一个关于直接在语法上支持这个模式的提案：生成器向类似运行器的工具yield出promise，这个运行器工具会在promise完成时恢复生成器。让我们来简单了解一下这个提案提出的特性async function。

提案的async function语法不需要run(..)工具就可以表达同样的流控制逻辑，因为JavaScript将会自动了解如何寻找要等待和恢复的promise。

比如：

async function main() {
  var ret = await step1();

  try {
    ret = await step2(ret);
  } catch (err) {
    ret = await step2Failed(err);
  }

  ret = await Promise.all([step3a(ret), step3b(ret), step3c(ret)]);

  await step4(ret);
}

main().then(
  function fulfilled() {
    // main()成功完成
  },
  function rejected(reason) {
    // 哎呀，出错了
  },
);

没有使用function ＊main() {..声明，而是使用了async function main() {..形式。而且，没有yield出一个promise，而是await这个promise。调用来运行函数main()实际上返回了一个可以直接观察的promise。这和从run(main)调用返回的promise是等价的。

看到这种对称性了吗？async function本质上就是生成器+promise+run(..)模式的语法糖；它们底层的运作方式是一样的！

Object.observe(..)

1、书中的观点

Web前端开发的圣杯之一就是数据绑定——侦听数据对象的更新，同步这个数据的DOM表示。多数JavaScript框架都为这类操作提供了某种机制。

可能在后ES6，我们将会看到通过工具Object.observe(..)直接添加到语言中的支持。本质上说，这个思路就是你可以建立一个侦听者（listener）来观察对象的改变，然后在每次变化发生时调用一个回调。例如，你可以据此更新DOM。

2、实际上

ES6 新增了Proxy。

Proxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。

Proxy 提供了比 Object.observe() 更丰富的操作选项，包括但不限于读取、修改、函数调用、in 操作符等，并且可以代理整个对象，返回一个新的对象。这些特性使得 Proxy 成为实现数据劫持和双向绑定的更优选择。

指数运算符

ES6新增一个运算符用于执行指数运算，就像Math.pow(..)一样。

var a = 2;

a ** 4; // Math.pow( a, 4 ) == 16

a **= 3; // a = Math.pow( a, 3 )
console.log(a); // 8

对象属性与...

对象的扩展运算符，本考虑在ES6中支持这个功能，但已经被推迟到了ES6之后（目前ES2018 将这个运算符引入了对象）。

它的使用方式如下：

var o1 = { a: 1, b: 2 },
  o2 = { c: 3 },
  o3 = { ...o1, ...o2, d: 4 };

console.log(o3.a, o3.b, o3.c, o3.d);
// 1 2 3 4

...运算符可能也会用于把对象的解构属性收集到一个对象：

var o1 = { b: 2, c: 3, d: 4 };
var { b, ...o2 } = o1;

console.log(b, o2.c, o2.d); // 2 3 4

在这里，...o2把解构的c和d属性重新收集回到o2对象（o2没有o1中的a b属性）。

Array#includes(..)

JavaScript开发者需要执行的一个极其常见的任务就是在值数组中搜索一个值。一直以来实现这个任务的方法是：

var vals = ['foo', 'bar', 42, 'baz'];
if (vals.indexOf(42) >= 0) {
  // 找到了！
}

使用>= 0检查的原因是，如果找到的话indexOf(..)返回一个0或者更大的数字值，如果没有找到就会返回-1。换句话说，我们是在布尔值上下文中使用返回索引的函数。因为-1为真而不是假，所以需要更多的手动检查。

于是出现了一个获得了大量支持的提案，提出增加一个真正返回布尔值的数组搜索方法，称为includes(..):

var vals = ['foo', 'bar', 42, 'baz'];

if (vals.includes(42)) {
  // 找到了！
}

ES2016 引入了该方法。Array.prototype.includes方法返回一个布尔值，表示某个数组是否包含给定的值，与字符串的includes方法类似。

总结

我们来总结一下本篇的主要内容：

• ES6新主题，这是这个语言的令人激动的新特性和范式，将会永久地改进JavaScript程序。
• 但ES6并不是JavaScript的终结。还早得很呢！在“ES6之后”这段时间已经出现了大量处于各种开发阶段的新特性。

作者介绍
非职业「传道授业解惑」的开发者叶一一。
《趣学前端》、《CSS畅想》等系列作者。华夏美食、国漫、古风重度爱好者，刑侦、无限流小说初级玩家。
如果看完文章有所收获，欢迎点赞👍 | 收藏⭐️ | 留言📝。