用例1

//promise源码解析

const promise1=new Promise(function(resolve,reject){
    // 我们在promise里面写个定时器
    setTimeout(()=>{
        resolve(1)  
    },1000)
})
// 然后在外部调用 （promise都有个then方法）
promise1.then(data=>{
    console.log(data)  //返回1
},err=>{
    console.log(err)
})

企业微信截图_16450763696202.png

分析1

resolve(1) 就是

(data=>{
    console.log(data)  //返回1
},err=>{
    console.log(err)
})

方法的调用，换句话说：上面的代码块就是函数的定义

本质来说还是回调 ,但是较回调而言，它可以连续的then

用例2

console.log(1)
// 微任务队列 同步执行之后执行微任务队列
//第一个宏任务
setTimeout(()=>{
    console.log(5,'添加到宏任务队列')
})
// 微任务
const promise2=new Promise(function(resolve,reject){
    console.log(2,"new Promise()函数体里面的代码为同步代码会同步执行")
    //第二个宏任务
    setTimeout(()=>{
        resolve(6)
    },0)
})
console.log(3)
function printLog(){
    console.log(4)
}


promise2.then(res=>{
    console.log(res)
})
printLog()

返回结果

image.png

分析2

Event lop 不知道的可以百度自己了解一下

js代码执行顺序

1，从上往下执行，遇到setTimeout,setInterval等宏任务添加到宏任务队列，遇到promise等微任务添加到微任务队列，同步代码执行完之后，执行微任务队列。

2，执行下一个宏任务，比如setTimeout函数体里面的，先执行同步代码，然后执行微任务代码，遇到宏任务就添加到宏任务队列

3，new Promise()函数体里面的代码为同步代码会同步执行，.then里的代码为异步代码。

说明：什么是同步和异步

image.png

异步处理操作在回调队列里面，所以同步的先执行

用例3

promise的两个参数使用

const promise1 = new Promise((resolve,reject)=>{
    setTimeout(()=>{
        const tempNum = Math.random()
        tempNum>.5&&resolve('success')||reject('fail')
    })
})
promise1.then((res)=>{
    console.log(res)
    return res+"plus"
},err=>{
    console.log(err)
    return err+"plus"
}).then((res)=>{
    console.log(res)
})

image.png

FIXME: 2022年2月17日   未完继续