Promise
Promise简介
- 最简单的Promise
const promise = new Promise((reslove) => {
setTimeout(() => {
reslove(100)
})
})
console.log(promise)
image.png
- 处理非异步情况
const rs = new Promise((reslove) => {
reslove(100)
})
console.log(rs)
image.png
-
Promise的三种不同状态之间的转换关系
image.png
Promise Chain
const rs = new Promise((reslove, reject) => {
reslove(100)
})
rs.then(res => {
return res + 1
}).then(res => {
console.log(res) // 101
})
Promise每次调用then 都是创建一个新的Promise对象
const rs = new Promise((reslove, reject) => {
reslove(100)
})
const a = rs.then(res => {
return res + 1
})
const b = a.then(res => {
console.log(res)
})
console.log(a == b) // false
Promise#catch 其实只是 promise.then(undefined, onRejected)方法的别名
但是 then里面指定函数错误处理和 catch有什么区别呢？
Promise.resolve().then(() => {
throw Error('error')
}, err=>{
console.log(err)
})
Promise.resolve().then(() => {
throw Error('error')
}).catch(err=>{
console.log(err)
})
image.png
我们可以看出catch可以捕获到then中的错误,但是then第二个参数只能捕获上一个Promise对象的错误。原因是then方法第二个参数只能捕获当前Promise对象或上一个Promise的错误，而不能捕获then里面的错误。
async await return
- 没有return的场景
const p = new Promise((reslove, reject) => {
setTimeout(() => {
reslove(100)
}, 100)
})
const ds = async () => {
await p
}
image.png
- 加上return的场景
const p = new Promise((reslove, reject) => {
setTimeout(() => {
reslove(100)
}, 100)
})
const ds = async () => {
return await p
}
image.png
我们知道async/await 的优势在于处理 then 链,每一个then的第一个参数都是前一个promise的返回值。理解了上面的Promise Chain链就理解了async
await 是否return的区别
Geneartor yield 和return 区别
function* fn() {
yield 123;
}
const f = fn()
console.log(f.next())
console.log(f.next())
image.png
function* fn() {
yield 123;
return 456
}
const f = fn()
console.log(f.next())
console.log(f.next())
image.png
Geneartor return和yield区别
- return 代表终结遍历，之后的yiled语句都失效
- 一个Geneartor函数默认是
return undefined,当return有参数时候。返回return中的数据。
