javascriptの文法自己測定(非同期)

3098 ワード

以前にこの作者から紹介されたjavascriptの文法の自己測定を紹介しました.今は異歩的な話をしています.
async
まず、最外層のテストです.チューニングdoneを与えました.その後、finishを2回呼び出した時、doneを呼び出します.
it('you should understand how to use promises to handle asynchronicity', function(done) {
  var flag = false;
  var finished = 0;
  var total = 2;

  function finish(_done) {
    if (++finished === total) { _done(); }
  }

  asyncAnswers.async(true).then(function(result) {
    flag = result;
    expect(flag).to.eql(true);
    finish(done);
  });

  asyncAnswers.async('success').then(function(result) {
    flag = result;
    expect(flag).to.eql('success');
    finish(done);
  });

  expect(flag).to.eql(false);
});
テストコードは比較的簡単で、thenが実行するコールバック関数の入力はasyncの入力であることを保証しなければならないので、新たにpromiseに戻りました.promiseをサポートするブラウザの中でテストに合格できます.
async: function(value) {
  return new Promise(function (resolve) {
    resolve(value);
  });
},
もちろん文法飴を通してもいいです.
async: function(value) {
  return Promise.resolve(value);
}
著者の答えは、JqueryのDeferredを利用しています.
 async: function(value) {
    var dfd = $.Deferred();
    setTimeout(function() {
      dfd.resolve(value);
    }, 10);
    return dfd.promise();
  },
maipulate RemoteData
テーマはJsonデータを獲得して、nameの抽出と並べ替えを行います.jsonデータは以下の通りです.
{
  "people" : [
    { "name" : "Matt" },
    { "name" : "Rebecca" },
    { "name" : "Paul" },
    { "name" : "Alex" },
    { "name" : "Adam" }
  ]
}
言い‐きる
 it('you should be able to retrieve data from the server and return a sorted array of names', function(done) {
    var url = '/data/testdata.json';

    asyncAnswers.manipulateRemoteData(url).then(function(result) {
      expect(result).to.have.length(5);
      expect(result.join(' ')).to.eql('Adam Alex Matt Paul Rebecca');
      done();
    });
  });
プロミセで書いたコードです.
manipulateRemoteData: function(url) {
  return Promise.resolve($.ajax(url)).then(function (value) {
    var res = [];
    var people = value.people;
    for(var i=0;i
著者からのコードは、mapを使っています.

  manipulateRemoteData: function(url) {
    var dfd = $.Deferred();

    $.ajax(url).then(function(resp) {
      var people = $.map(resp.people, function(person) {
        return person.name;
      });
      dfd.resolve(people.sort());
    });

    return dfd.promise();
  }
};
プロモーションを使って、異歩を書いてみます.
    return new Promise(function (resolve,reject) {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function () {
          if (xhr.readyState == 4) {
            if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) {
              resolve(xhr.responseText);
            } else {
              reject(xhr.status);
            }
        }
       xhr.open("get","url",true);
       xhr.send()
      }
    })