【javascript】异步编年史，从“纯回调”到Promise

ajax("http://XXX.", callback);
doOtherThing()

ajax( "..", function(..){    } );

array.foreach(
  x =>  console.log(x)
)
console.log(array)

setTimeout( () => {  console.log(‘我是异步的‘)  }，０ )
console.log(‘我是同步的‘)

我是同步的
我是异步的

我是异步的
我是同步的

// 注: 这是一个相当乌托邦,且省略诸多内容的函数
function login (callback) {
        // 当取得的账号变量name的值为空时， 立即调用函数，此时callback同步调用）
       if(!name) {
           callback();
           return   // name为空时在这里结束函数
        }
       // 当取得的账号变量name的值不为空时， 在请求成功后调用函数（此时callback异步调用）
      request(‘post‘, name, callback)
}

var a =1
zalgoFunction () {
  // 这里还有很多其他代码,使得a = 2可能被异步调用也可能被同步调用
    [  a = 2  ]
  }
console.log(a)

analytics.purchase( purchaseData, function  () {
      payWithYourMoney ()
} );

var analysisFlag  = true // 判断是否已经分析（支付）过一次了
analytics.purchase( purchaseData, function(){
     if (！analysisFlag) {
           payWithYourMoney ()
            analysisFlag = false
     }
} );

doA( function(){
    doB();
    doC( function(){
      doD();
          } )
    doE();
} );
doF();
 

setTimeout(function (name) {
  var catList = name + ‘,‘
  setTimeout(function (name) {
    catList += name + ‘,‘;
    setTimeout(function (name) {
      catList += name + ‘,‘;
      setTimeout(function (name) {
        catList += name + ‘,‘;
        setTimeout(function (name) {
          catList += name;
          console.log(catList);
        }, 1, ‘Lion‘);
      }, 1, ‘Snow Leopard‘);
    }, 1, ‘Lynx‘);
  }, 1, ‘Jaguar‘);}, 1, ‘Panther‘);

var a, b;
function foo(x) {
   a = x * 2;
   if (a && b) {
        baz();
    }
}
function bar(y) {
    b = y * 2;
    if (a && b) {
           baz();
    }
}
function baz() {
     console.log( a + b );
}
// ajax(..)是某个库中的某个Ajax函数
ajax( "http://some.url.1", foo );
ajax( "http://some.url.2", bar );

var flag = true;
function foo(x) {
    if (flag) {
        x = x + 1
        baz(x);
        flag = false
     }
}
function bar(x) {
     if (flag) {
         x = x*2
         baz(x);
         flag = false
     }
}
function baz( x ) {
       console.log( x );
}
// ajax(..)是某个库中的某个Ajax函数
ajax( "http://some.url.1", foo );
ajax( "http://some.url.2", bar );

new Promise(function() {
      /* 异步操作  */
}

var promise = new Promise(function(resolve, reject) {
  // 这里是一堆异步操作的代码
  if (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});

promise.then(function(value) {
  // 成功
}, function(error) {
  // 失败
});

var p = new Promise( function(resolve,reject){
     foo.bar(); // foo未定义，所以会出错！
     resolve( 42 ); // 永远不会到达这里 :(
} );
p.then(
   function fulfilled(){
       // 永远不会到达这里 :(
    },
    function rejected(err){
        // err将会是一个TypeError异常对象来自foo.bar()这一行
     }
);

// 用于超时一个Promise的工具
function timeoutPromise(delay) {
   return new Promise( function(resolve,reject){
      setTimeout( function(){
            reject( "Timeout!" );
          }, delay );
      } );
}

// 设置foo()超时
Promise.race( [
   foo(), // 试着开始foo()
   timeoutPromise( 3000 ) // 给它3秒钟
] )
.then(
   function(){
   // foo(..)及时完成！
   },
   function(err){
   // 或者foo()被拒绝，或者只是没能按时完成
   // 查看err来了解是哪种情况
  }
);

Promise.then(
  // 第一个异步操作
).then(
  // 第二个异步操作
).then(
  // 第三个异步操作
)

getJSON(‘/post/1.json‘).then(function(post) {
  return getJSON(post.commentURL);
}).then(function(comments) {
  // some code
})
 

Promise.all([
  promise1,
  promise2
])
.then(([data1, data2]) =>  getDataAndDoSomething (data1,data2)

var p = Promise.race([p1, p2, p3]);