搜尽全网,整理了19道promise 面试题,你能做对几个?

简介: 业务开发中经常用Promise,但是第一题真不一定能作对。。。。。emmm,我说的是别犹豫的、能非常肯定的给出答案的哪种...作为前端开发,相信日常开发中Promise的使用率应该时最高的,另外面试中js基础部分考察最多的也莫过于Promise,所以Promise的重要性咱就不多说了。说的那么重要,是不是有点夸张了,想想不就几个api吗?但是真的了解他的运行机制吗?现在不管是大厂还是小厂,promise 已经成为了面试必考知识点;可是真正掌握了多少,真正面试的时候,又能有多少把握呢?平时大家忙于业务开发,很多基础知识时间一长就容易淡忘,所以本文根据 Promise 的一些知识点总结

业务开发中经常用Promise,但是第一题真不一定能作对。。。。。emmm,我说的是别犹豫的、能非常肯定的给出答案的哪种...

作为前端开发,相信日常开发中Promise的使用率应该时最高的,另外面试中js基础部分考察最多的也莫过于Promise,所以Promise的重要性咱就不多说了。

说的那么重要,是不是有点夸张了,想想不就几个api吗?但是真的了解他的运行机制吗?现在不管是大厂还是小厂,promise 已经成为了面试必考知识点;可是真正掌握了多少,真正面试的时候,又能有多少把握呢?

平时大家忙于业务开发,很多基础知识时间一长就容易淡忘,所以本文根据 Promise 的一些知识点总结

主要考察点


  • 执行顺序
  • 值透传
  • 错误处理
  • 返回值
  • 链式调用

最终考察的还是我们对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)
  })

#06

难易程度:⭐⭐

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)
})

#07

难易程度:⭐⭐⭐

Promise.resolve()
  .then(() => {
    return new Error('error!!!')
  })
  .then((res) => {
    console.log('then: ', res)
  })
  .catch((err) => {
    console.log('catch: ', err)
  })

#08

难易程度:⭐⭐⭐⭐

const promise = Promise.resolve()
  .then(() => {
    return promise
  })
promise.catch(console.error)

#09

难易程度:⭐⭐⭐

Promise.resolve(1)
  .then(2)
  .then(Promise.resolve(3))
  .then(console.log)

#10

难易程度:⭐⭐⭐

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)
  })

#11

难易程度:⭐⭐⭐⭐

process.nextTick(() => {
  console.log('nextTick')
})
Promise.resolve()
  .then(() => {
    console.log('then')
  })
setImmediate(() => {
  console.log('setImmediate')
})
console.log('end')

#12

难易程度:⭐⭐⭐⭐

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);

#13

难易程度:⭐⭐

var p = new Promise((resolve, reject) => {
  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) => {
  return Promise.reject(Error('The Fails!'))
})
p.catch(error => console.log(error.message))
p.catch(error => console.log(error.message))

#15

难易程度:⭐⭐

var p = new Promise((resolve, reject) => {
    reject(Error('The Fails!'))
  })
  .catch(error => console.log(error))
  .then(error => console.log(error))

#16

难易程度:⭐⭐

new Promise((resolve, reject) => {
    resolve('Success!')
  })
  .then(() => {
    throw Error('Oh noes!')
  })
  .catch(error => {
    return "actually, that worked"
  })
  .catch(error => console.log(error.message))

#17

难易程度:⭐⭐

Promise.resolve('Success!')
  .then(data => {
    return data.toUpperCase()
  })
  .then(data => {
    console.log(data)
    return data
  })
  .then(console.log)

#18

难易程度:⭐⭐

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))

#19

难易程度:⭐⭐⭐⭐

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);

#20

难易程度:⭐⭐⭐⭐⭐

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个代码题未贴答案,后面会单独发送。

也欢迎大家在留言区回复参与答题。

今天一提就到这里,希望对你有所帮助。

目录
相关文章
|
3月前
|
前端开发 JavaScript API
【面试题】说说 Promise是什么?如何使用
【面试题】说说 Promise是什么?如何使用
|
3月前
|
前端开发
【面试题】吃透Promise?先实现一个再说(包含所有方法)(二)
【面试题】吃透Promise?先实现一个再说(包含所有方法)(二)
|
3月前
|
存储 运维 前端开发
【面试题】吃透Promise?先实现一个再说(包含所有方法)(一)
【面试题】吃透Promise?先实现一个再说(包含所有方法)(一)
|
3月前
|
前端开发 JavaScript
No101.精选前端面试题,享受每天的挑战和学习(Promise)
No101.精选前端面试题,享受每天的挑战和学习(Promise)
|
3月前
|
前端开发 JavaScript API
【面试题】面试官:为什么Promise中的错误不能被try/catch?
【面试题】面试官:为什么Promise中的错误不能被try/catch?
|
9月前
|
前端开发 JavaScript
Promise入门/面试必看
Promise入门/面试必看
56 0
|
10月前
|
设计模式 JSON 前端开发
前端面试必看(手写Promise+js设计模式+继承+函数柯里化等)JavaScript面试全通关(1/3)
前端面试必看(手写Promise+js设计模式+继承+函数柯里化等)JavaScript面试全通关(1/3)
63 0
|
前端开发 JavaScript
web前端面试高频考点——JavaScript 篇(二)【JS 异步进阶】Event Loop、then 和 catch、async/await、宏任务微任务、手撕 Promise 源码
web前端面试高频考点——JavaScript 篇(二)【JS 异步进阶】Event Loop、then 和 catch、async/await、宏任务微任务、手撕 Promise 源码
161 0
|
前端开发 算法 安全
前端面试100道手写题(1)—— 手写Promise实现
今年的金三银四面试,遇到了很多新的面试八股文,其实心里对手写题或者算法题有一定抵触,因为实际工作中基本上就不会用到这些东西,但是正因为这些基础八股文,才能真正验证一个人对技术有多热爱的程度。也有可能近几年没有对这些基础知识进行巩固,所以干脆一狠心,先立个flag, 准备完成100道手写题。
229 0
|
前端开发
前端学习案例-promise面试题之1
前端学习案例-promise面试题之1
57 0
前端学习案例-promise面试题之1