用例1
//promise源碼解析
const promise1=new Promise(function(resolve,reject){
// 我們在promise里面寫個(gè)定時(shí)器
setTimeout(()=>{
resolve(1)
},1000)
})
// 然后在外部調(diào)用 （promise都有個(gè)then方法）
promise1.then(data=>{
console.log(data) //返回1
},err=>{
console.log(err)
})
企業(yè)微信截圖_16450763696202.png
分析1
resolve(1) 就是
(data=>{
console.log(data) //返回1
},err=>{
console.log(err)
})
方法的調(diào)用屏歹，換句話說：上面的代碼塊就是函數(shù)的定義
本質(zhì)來說還是回調(diào) ,但是較回調(diào)而言，它可以連續(xù)的then
用例2
console.log(1)
// 微任務(wù)隊(duì)列 同步執(zhí)行之后執(zhí)行微任務(wù)隊(duì)列
//第一個(gè)宏任務(wù)
setTimeout(()=>{
console.log(5,'添加到宏任務(wù)隊(duì)列')
})
// 微任務(wù)
const promise2=new Promise(function(resolve,reject){
console.log(2,"new Promise()函數(shù)體里面的代碼為同步代碼會(huì)同步執(zhí)行")
//第二個(gè)宏任務(wù)
setTimeout(()=>{
resolve(6)
},0)
})
console.log(3)
function printLog(){
console.log(4)
}
promise2.then(res=>{
console.log(res)
})
printLog()
返回結(jié)果
image.png
分析2
Event lop 不知道的可以百度自己了解一下
js代碼執(zhí)行順序
1圃庭，從上往下執(zhí)行，遇到setTimeout,setInterval等宏任務(wù)添加到宏任務(wù)隊(duì)列失晴，遇到promise等微任務(wù)添加到微任務(wù)隊(duì)列剧腻，同步代碼執(zhí)行完之后，執(zhí)行微任務(wù)隊(duì)列涂屁。
2书在，執(zhí)行下一個(gè)宏任務(wù)，比如setTimeout函數(shù)體里面的拆又，先執(zhí)行同步代碼儒旬，然后執(zhí)行微任務(wù)代碼，遇到宏任務(wù)就添加到宏任務(wù)隊(duì)列
3帖族，new Promise()函數(shù)體里面的代碼為同步代碼會(huì)同步執(zhí)行栈源，.then里的代碼為異步代碼。
說明：什么是同步和異步
image.png
異步處理操作在回調(diào)隊(duì)列里面竖般，所以同步的先執(zhí)行
用例3
promise的兩個(gè)參數(shù)使用
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日 未完繼續(xù)
