Promise 想必大家十分熟悉,想想就那么几个 api,可是你真的了解 Promise 吗?本文根据 Promise 的一些知识点总结了十道题,看看你能做对几道。
题目一
const promise = new Promise((resolve, reject) => {
console.log(1)
resolve()
console.log(2)
})
promise.then(() => {
console.log(3)
})
console.log(4)
题目二
const promise1 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('success')
}, 1000)
})
const promise2 = promise1.then(() => {
throw new Error('error!!!')
})
console.log('promise1', promise1)
console.log('promise2', promise2)
setTimeout(() => {
console.log('promise1', promise1)
console.log('promise2', promise2)
}, 2000)
题目三
const promise = new Promise((resolve, reject) => {
resolve('success1')
reject('error')
resolve('success2')
})
promise
.then((res) => {
console.log('then: ', res)
})
.catch((err) => {
console.log('catch: ', err)
})
题目四
Promise.resolve(1)
.then((res) => {
console.log(res)
return 2
})
.catch((err) => {
return 3
})
.then((res) => {
console.log(res)
})
题目五
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
console.log('once')
resolve('success')
}, 1000)
})
const start = Date.now()
promise.then((res) => {
console.log(res, Date.now() - start)
})
promise.then((res) => {
console.log(res, Date.now() - start)
})
题目六
Promise.resolve()
.then(() => {
return new Error('error!!!')
})
.then((res) => {
console.log('then: ', res)
})
.catch((err) => {
console.log('catch: ', err)
})
题目七
const promise = Promise.resolve()
.then(() => {
return promise
})
promise.catch(console.error)
题目八
Promise.resolve(1)
.then(2)
.then(Promise.resolve(3))
.then(console.log)
题目九
Promise.resolve()
.then(function success (res) {
throw new Error('error')
}, function fail1 (e) {
console.error('fail1: ', e)
})
.catch(function fail2 (e) {
console.error('fail2: ', e)
})
题目十
process.nextTick(() => {
console.log('nextTick')
})
Promise.resolve()
.then(() => {
console.log('then')
})
setImmediate(() => {
console.log('setImmediate')
})
console.log('end')
结果
执行结果及解释见我的知乎文章:https://zhuanlan.zhihu.com/p/30797777
我也出个题
new Promise(resolve=>{
resolve(new Promise(reject=>{
setTimeout(()=>{
reject(Promise.resolve(1))
},3000)
}))
})
.then(console.log)
.catch(console.log)
@5196666qwe 厉害了…
@nswbmw 能详细讲一下 microtask 和macrotask 吗?
@leavesdrift 下一篇文章讲
mark
@nswbmw 坐等大佬讲解 microtask 和 macrotask, 之前看过很多文章,都没弄清楚为什么要设计成 microtask 和 macrotask。还有浏览器和 event loop 的关系,自己感觉浏览器一个 event loop 就可以,但是有些地方说的是浏览器不止一个 event loop。感谢~
@taooba event loop有轮数,然后task的类型也有分(不知道这么说对不对)
@5196666qwe 这个是类似例子8?
@qingmingsang 例子8是then中的参数如果不是函数,就会穿透下去。 1楼的例子是因为resolve一个promise实例时,这个resolve的promise会继续执行下去,直到resolve的不是promise,then才会执行
mark
@5196666qwe 谨防陷阱题!!! 你最内层Promise的 reject 实际是 resovle,所以并不会产生异常被 catch 住,而是 3 秒后正常打印 1