ES6发电机 - 他们真的可以替代异步/等待吗?

Jer*_*yow 4 javascript generator async-await typescript ecmascript-6

这篇打字稿博客文章评论部分的帖子之一说:

如果我必须等到2.0以获得ES6发电机支持,我就会坚持使用Traceur.生成器是一个大问题,他们今天使用Koa,Co,Bluebird等库为您提供异步/等待支持.

Async/await关键字将允许应用程序保留类似于同步代码的逻辑结构.如何使用发电机来完成类似的事情呢?例如,如何将生成器与ajax调用结合使用以生成避免使用回调的同步样式代码?

fra*_*amp 5

你只需要用辅助函数来抽象它.

假设jQuery:

function ajax(type, url, data){
  $.ajax({
    url: url,
    data: data,
    type: type
  })
  .done(function(data) {
    iterator.next(data);
  })
  .fail(function() {
    iterator.throw();
  });
}
var get = ajax.bind(null, 'GET');
var post = ajax.bind(null, 'POST');
var put = ajax.bind(null, 'PUT');
var patch = ajax.bind(null, 'PATCH');
var del = ajax.bind(null, 'DELETE');

function *asyncGet() {
  var URL = 'https://api.stackexchange.com/2.2/answers?order=desc&sort=activity&site=stackoverflow'
  var data = yield get(URL);
  console.log(data);
}

var iterator = asyncGet();
iterator.next();
Run Code Online (Sandbox Code Playgroud)

使用另一个例子setTimeout:

function delayReturn(time, val){
  setTimeout(function(){
    iterator.next(val);
  }, time);
}
var delayReturn1s = delayReturn.bind(null, 1000);

function *main() {
  console.log(yield delayReturn1s('Lolcat'));
}

var iterator = main();
iterator.next()
Run Code Online (Sandbox Code Playgroud)

当然你可以用这样的东西抽象迭代器:

var async = function(generator){
  var resume = function(err, data){
    if (err) iterator.throw();
    iterator.next(data);
  }
  var iterator = generator(resume);
  iterator.next();
}
Run Code Online (Sandbox Code Playgroud)

然后你可以简单地说:

function ajax(type, url, data, cb){
  $.ajax({
    url: url,
    data: data,
    type: type
  })
  .done(function(data) {
    cb(null, data)
  })
  .fail(function() {
    cb(arguments);
  });
}
var get = ajax.bind(null, 'GET');
var post = ajax.bind(null, 'POST');
var put = ajax.bind(null, 'PUT');
var patch = ajax.bind(null, 'PATCH');
var del = ajax.bind(null, 'DELETE');

async(function *(resume) {
  var URL = 'https://api.stackexchange.com/2.2/answers?order=desc&sort=activity&site=stackoverflow'
  var data = yield get(URL, null, resume);
  console.log(data);
});
Run Code Online (Sandbox Code Playgroud)

  • async/await的部分目的是让您自由编写语法清晰的代码,而不必诉诸于此类"选项".是的,这基本上是相同的,但它实际上仍然不是同一个东西,因为**语法**与async/await的**语义**同样重要. (3认同)