如何使用 ES6 承诺和生成器加载 xmlHttpRequest 资源 inline/sequentially?

How Load xmlHttpRequest resources inline/sequentially with ES6 Promises & Generators?

我如何创建一个 "data = xhrLoad(url)" 内部异步但 w/o .then 或回调 "hell" 的函数?我希望 xhrLoad 发挥 Promise/Generator 魔力,但只有在数据可用时才 return。

示例:

data = initMyProgram(); // may call data = xhrLoad(url)
<use data here>
<more inline code here>

我意识到 Promise 很棒,.then/.catch 很复杂..但我想要内联的顺序代码..如果数据可用,甚至可能不需要的代码片段 w/o 外部资源。

Ex:在 webgl 编程中,着色器可以在 <scripts>、外部文件、es6 模块、es6 模板字符串等中。如果需要,我想通过 xhr 请求来神奇地管理它在 initMyProgram returns.

之前完成

虽然在 ES6 中可以做到,但不一定很方便。但是有几个blog posts,按照它们应该很简单。

有一个提案 async/await for ES7. Babel 已经支持。

请注意,async/await 只是处理 promise 的语法糖。声明为异步的函数总是 return 一个承诺,因此在顶层你仍然必须使用承诺 API。 await 只能在 async 函数内部使用,但任何 return 的承诺都可以等待。

Example:

function foo() {
  return new Promise(resolve => {
    setTimeout(() => resolve(42), 3000);
 });
}

async function bar() {
  let answer = await foo();
  console.log(answer);
  return answer * 2;
}

bar().then(result => console.log(result));

请记住,这是一项实验性功能,它的工作方式可能会随着时间的推移而改变。