promise的使用

为什么需要promise？

1. 存在像定时器和ajax请求这样的异步函数
2. 异步函数的特点就是代码执行顺序并非按照常规的从上往下执行而且顺序不固定

setTimeout(function () {
            console.log('1')
        }, 2000 );
        setTimeout(function () {
            console.log('2')
        }, 1000 );
        setTimeout(function () {
            console.log('3')
        }, 500 );
 // 结果
 // 3
 // 2
 // 1

3. 假如要实现等2秒打印1，再等1秒打印2，再等0.5秒打印3就必须嵌套实现

setTimeout(function () {
            console.log('1')
            setTimeout(function () {
                console.log('2')
                setTimeout(function () {
                    console.log('3')
                }, 500);
            }, 1000);
        }, 2000);

4. 如果打印的结果越来越多，嵌套也就越来越多，非常不好维护
5. promise就是为了解决这种太多异步函数嵌套而存在的。

基本用法

1. promise是一个对象，可以获取异步操作的消息
2. 首先实例化一个promise对象，构造函数中传递函数，该函数中用于处理异步任务

var p = new Promise(function(resolve,reject){
            // 此处写要处理的异步函数
        })

3. 处理异步函数

var p = new Promise(function (resolve, reject) {
            // 此处写要处理的异步函数
            setTimeout(function () {
                console.log('1')
                var flag = true
                if(flag){
                    resolve('成功') //函数处理成功的情况
                }else{
                    reject('失败') //函数处理失败的情况
                }
            }, 1000);
        })

4. 如果这里直接打印p是得不到函数处理的结果的

console.log(p);
// 结果
// Promise {<pending>}

5. 要通过p.then得到函数处理的结果

p.then(function(res){
        console.log(res) //resolve中的参数会传到res上
  },function(err){
        console.log(err); //resolve中的参数会传到err上     
  })

多个异步函数

function test(num) {
            var p = new Promise(function (resolve, reject) {
                // 此处写要处理的异步函数
                setTimeout(function () {
                    console.log(num)
                    var flag = true
                    if (flag) {
                        resolve('成功') //函数处理成功的情况
                    } else {
                        reject('失败') //函数处理失败的情况
                    }
                }, 1000);
            })
            return p
        }
        
        test(1).then(function (res) {
            console.log(res)
            return test(2)
        }).then(function (res) {
            console.log(res)
            return test(3)
        }).then(function(res){
            console.log(res)
        })

then的返回值

1. 返回promise对象用下一个then继续调用，打印得到resolve的结果
2. 返回普通值会自动生成一个promise对象，打印得到普通值

总结

1. 用promise包裹住要处理的异步函数用then+return的形式让其按顺序执行
2. 实际用起来还是挺不方便的挺绕的，但相比起多层嵌套，这显得优雅许多，算是为后面的async和awit做铺垫吧