JS中的回调函数，以及ES6中通过promise处理回调

简要介绍：ES6中，可以通过promise来处理回调函数，回调函数经常用于异步操作中，间接来说，可以通过promise优化异步操作。

1.什么是JS中的回调函数？

回调函数是作为参数传递给另外一个函数，并且改回调函数在函数主题执行完后再执行。举例来说：

function callback(m,n){
 alert("我是回调函数，我在执行");
 return m+n
}

function myFunction(callback){
   var m=1;
   var n=2;
   return callback(1,2);
}

上述就是一个回调函数的例子，callback为回调函数，我们来看函数myFunction的执行过程，先执行函数的主题，最后再执行回调函数callback。

2.常见的回调函数以及存在的缺陷

（1）常见回调：

我们在jquery的ajax请求中，可以看到回调的身影，比如：

ajax({
 url:'...',
 method:'get',
 success:function(json){
    //这里就是一个回调

 }
})

经典的封装后的ajax请求就是一个，success后面所跟的函数就是一个回调函数。

（2）存在问题

因为JS是异步的，通过回调函数异步操作，会造成回调函数的嵌套，很影响代码的可读性，下面来看回调函数嵌套的情况。

ajax({
 url:'...',
 method:'get',
 success:function(json){
    //这里是一个回调
    ajax(function(json){
     //这是一个回调函数的嵌套
    });
 }
})

上述我们看到，当最外层请求成功之时，会调用第一个回调函数，而第一个回调函数里面又嵌套了第二个异步的回调函数，如此层层嵌套，代码的可读性大大的下降。

3.promise处理回调嵌套

（1）什么是promise

promise通常用于处理函数的异步调用，通过链式调用的方式，使得代码更加直观，举例来说：

var myPromise=function(tag){

  return new Promise(function(resolve,reject){
    if(tag){
      resolve('默认参数success');
    }else{
      reject('默认参数filed');
    }
})
}

myPromise(true).then(function(message){
  console.log(message)
})  //"输出默认参数success"

我们可以看到设置promise只要new Promise（）就可以，并且接受一个函数，该函数里面会执行resolve()方法，表示异步调用成功时执行，reject()表示异步调用失败时候调用。

在链式调用时候，then后面接的第一个函数为成功之时调用的函数——resolve,并且这里的默认参数等同于promise中resolve中的初始参数。

（2）then和catch

then:可以在promise中实现链式调用，在上文中已经介绍。补充，then里面的第二个函数，为异步调用失败之时执行,接上面的例子：

myPromise(false).then(null,function(err){
  console.log(err)
})
//这样会输出"默认参数filed"

catch：catch方法，相当于then(null，function（err）{console.log(err)}失败方法调用的一个缩写。

myPromise(false).catch(function(err){console.log(err)})
//这句话与上面等价，也会输出"默认参数filed"

（3）Promise.all

Promise.all 可以接收一个元素为 Promise 对象的数组作为参数，当这个数组里面所有的 Promise 对象都变为 resolve 时，该方法才会返回。

var p1 = new Promise(function (resolve) {
    setTimeout(function () {
        resolve("Hello");
    }, 3000);
});

var p2 = new Promise(function (resolve) {
    setTimeout(function () {
        resolve("World");
    }, 1000);
});

Promise.all([p1, p2]).then(function (result) {
    console.log(result); // ["Hello", "World"]
});

4.总结
Promise在定义的时候，在new的时候就会执行一次，因此如果要构造ajax请求可以在new Promise里传递的这个函数内进行，在定义这个构造Promise的函数里面，可以判断什么时候是执行resolve，什么时候执行reject。