分享
定制
以下文章來源于前端技術江湖 ,作者花甲
業(yè)務開發(fā)中經(jīng)常用Promise,但是第一題真不一定能作對。
。
。
。
。
emmm,我說的是別猶豫的、能非常肯定的給出答案的哪種...
作為前端開發(fā),相信日常開發(fā)中Promise的使用率應該時最高的,另外面試中js基礎部分考察最多的也莫過于Promise,所以Promise的重要性咱就不多說了。
說的那么重要,是不是有點夸張了,想想不就幾個api嗎?但是真的了解他的運行機制嗎?現(xiàn)在不管是大廠還是小廠,Promise 已經(jīng)成為了面試必考知識點;可是真正掌握了多少,真正面試的時候,又能有多少把握呢?
平時大家忙于業(yè)務開發(fā),很多基礎知識時間一長就容易淡忘,所以本文根據(jù) Promise 的一些知識點總結(jié)了19道題,看看你能做對幾道,希望對你有點幫助。
PS:下面題目沒有附答案,有了答案想必會降低大家的思考深度,起不到什么效果,完整答案會在后面文章單獨發(fā)出。
主要考察點
執(zhí)行順序
值透傳
錯誤處理
返回值
鏈式調(diào)用
最終考察的還是我們對Promise的理解程度。
目標
通關標準,能夠給出答案,并且給出合理的解釋。
【為什么給出這個答案?】
#01
難易程度:???
Promise.resolve(1)
.then((res) => {
console.log(res)
return 2
})
.catch((err) => {
return 3
})
.then((res) => {
console.log(res)
})
#02
難易程度:?
const promise = new Promise((resolve, reject) => {
console.log(1)
resolve()
console.log(2)
})
promise.then(() => {
console.log(3)
})
console.log(4)
#03
難易程度:???
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)
#04
難易程度:??
setTimeout(()=> console.log(5), 0);
new Promise(resolve => {
console.log(1);
resolve(3);
Promise.resolve().then(()=> console.log(4))
}).then(num => {
console.log(num)
});
console.log(2);
#05
難易程度:??
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)
})
#05
難易程度:??
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)
})
#06
難易程度:???
Promise.resolve()
.then(() => {
return new Error('error!!!')
})
.then((res) => {
console.log('then: ', res)
})
.catch((err) => {
console.log('catch: ', err)
})
#07
難易程度:????
const promise = Promise.resolve()
.then(() => {
return promise
})
promise.catch(console.error)
#08
難易程度:???
Promise.resolve(1)
.then(2)
.then(Promise.resolve(3))
.then(console.log)
#09
難易程度:???
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)
})
變種后
Promise.resolve()
.then(function success1 (res) {
throw new Error('error')
}, function fail1 (e) {
console.error('fail1: ', e)
})
.then(function success2 (res) {
}, function fail2 (e) {
console.error('fail2: ', e)
})
#10
難易程度:????
process.nextTick(() => {
console.log('nextTick')
})
Promise.resolve()
.then(() => {
console.log('then')
})
setImmediate(() => {
console.log('setImmediate')
})
console.log('end')
#11
難易程度:????
const first = () => (new Promise((resolve, reject) => {
console.log(3);
let p = new Promise((resolve, reject) => {
console.log(7);
setTimeout(() => {
console.log(5);
resolve(6);
}, 0)
resolve(1);
});
resolve(2);
p.then((arg) => {
console.log(arg);
});
}));
first().then((arg) => {
console.log(arg);
});
console.log(4);
#12
難易程度:??
var p = new Promise((resolve, reject) => {
reject(Error('The Fails!'))
})
p.catch(error => console.log(error.message))
p.catch(error => console.log(error.message))
#13
難易程度:???
var p = new Promise((resolve, reject) => {
return Promise.reject(Error('The Fails!'))
})
p.catch(error => console.log(error.message))
p.catch(error => console.log(error.message))
#14
難易程度:??
var p = new Promise((resolve, reject) => {
reject(Error('The Fails!'))
})
.catch(error => console.log(error))
.then(error => console.log(error))
#15
難易程度:??
new Promise((resolve, reject) => {
resolve('Success!')
})
.then(() => {
throw Error('Oh noes!')
})
.catch(error => {
return "actually, that worked"
})
.catch(error => console.log(error.message))
#16
難易程度:??
Promise.resolve('Success!')
.then(data => {
return data.toUpperCase()
})
.then(data => {
console.log(data)
return data
})
.then(console.log)
#17
難易程度:??
Promise.resolve('Success!')
.then(() => {
throw Error('Oh noes!')
})
.catch(error => {
return 'actually, that worked'
})
.then(data => {
throw Error('The fails!')
})
.catch(error => console.log(error.message))
#18
難易程度:????
const first = () => (new Promise((resolve,reject)=>{
console.log(3);
let p = new Promise((resolve, reject)=>{
console.log(7);
setTimeout(()=>{
console.log(5);
resolve(6);
},0)
resolve(1);
});
resolve(2);
p.then((arg)=>{
console.log(arg);
});
}));
first().then((arg)=>{
console.log(arg);
});
console.log(4);
#19
難易程度:?????
async function async1() {
console.log(1);
const result = await async2();
console.log(3);
}
async function async2() {
console.log(2);
}
Promise.resolve().then(() => {
console.log(4);
});
setTimeout(() => {
console.log(5);
});
async1();
console.log(6);
# 最后
以上19個代碼題未貼答案,后面會單獨發(fā)送。
也歡迎大家在留言區(qū)回復參與答題。
今天一提就到這里,希望對你有所幫助。
參考資料:
https://zhuanlan.zhihu.com/p/34421918
https://zhuanlan.zhihu.com/p/30797777
https://zhuanlan.zhihu.com/p/98164787
https://juejin.cn/post/6844903986210816013#heading-3
https://juejin.cn/post/6844903605250572302
【使用錘子簡歷小程序制作簡歷】
零經(jīng)驗實習簡歷模板
21254人用過
學生求職簡歷模板
52754人用過
申請研究生簡歷模板
2324人用過
經(jīng)典工作簡歷模板
6254人用過
投行咨詢簡歷模板
12465人用過
產(chǎn)品經(jīng)理簡歷模板
7532人用過
程序員簡歷模板
7457人用過
留學英文簡歷模板
4554人用過