ES6 或 ES7 中的这种语法是什么？答案

【问题标题】：What is this syntax in ES6 or ES7?ES6 或 ES7 中的这种语法是什么？
【发布时间】：2017-03-30 04:47:03
【问题描述】：

我遇到了我认为是 ES6 或 ES7 的语法。这几行代码有什么作用？

module.exports = async (taskData) => {
  // do stuff
}

【问题讨论】：

两者都不是，它的语法将在今年的 ES2017 版本中引入。

标签： ecmascript-6 ecmascript-2016

【解决方案1】：

它导出一个异步arrow function，它接受一个参数taskData。异步函数是今年发布的 ES2017 中设置的新语法，称为async function，尽管其余代码是 ES6 (ES2015) 和 ES5 (ES2011)。它与await 并驾齐驱并返回Promise。

清理 Promise 链主要有用，因为代码可能会变得非常混乱。考虑这个使用 Promise 的例子，发现 here:

function loadStory() {
  return getJSON('story.json').then(function(story) {
    addHtmlToPage(story.heading);

    return story.chapterURLs.map(getJSON)
      .reduce(function(chain, chapterPromise) {
        return chain.then(function() {
          return chapterPromise;
        }).then(function(chapter) {
          addHtmlToPage(chapter.html);
        });
      }, Promise.resolve());
  }).then(function() {
    addTextToPage("All done");
  }).catch(function(err) {
    addTextToPage("Argh, broken: " + err.message);
  }).then(function() {
    document.querySelector('.spinner').style.display = 'none';
  });
}

上面的示例获取一个故事，并遍历所有章节并将它们添加到 HTML。它有效，但如果你有很多事情要做，它可能会非常混乱且难以遵循。相反，您可以使用 async 和 await，它们只是语法糖，但更简洁：

async function loadStory() {
  try {
    let story = await getJSON('story.json');
    addHtmlToPage(story.heading);
    for (let chapter of story.chapterURLs.map(getJSON)) {
      addHtmlToPage((await chapter).html);
    }
    addTextToPage("All done");
  } catch (err) {
    addTextToPage("Argh, broken: " + err.message);
  }
  document.querySelector('.spinner').style.display = 'none';
}

与第一个示例中凌乱的承诺链相比，上面的（在我看来）方式更干净且易于遵循。

【讨论】：

【解决方案2】：

这是一个异步函数，正如@Andrew 所说，它设置为返回 Promise。它使用Arrow Function 语法。

()=>{}

这个函数在 ES6 中并且没有定义它自己的this 上下文并且任何this 的使用都将引用外部范围。

【讨论】：

【解决方案3】：

Async await 语法设置为在 ES2017 发布时支持。您的代码本质上是一个返回promise 的函数。此外，async 关键字允许在使用 await 关键字处理 Promise 时使用 syntactic sugar。

=> 部分被称为arrow function，这在很大程度上也是一种语法糖。它是 ES6 的一部分。

你的功能

module.exports = async (taskData) => {
  // do stuff
}

...几乎等同于：

module.exports = function(taskData) {
  return new Promise(function() {

    // do stuff
    if (err) reject(err)
    resolve(your return value)
  }
}

注意：主要区别只是通过箭头函数绑定this关键字。

【讨论】：

ES7 于去年发布。你的意思是 ES2017。