扫码关注官方微信

扫码下载APP
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >ES6中Promise、async和await面试题整理
  • 909

0
分享到

ES6中Promise、async和await面试题整理

es6 promise asynces6 async awaites6中的promise 2023-02-22 12:02:45 909人浏览 独家记忆
摘要

目录出题目的：知识点：代码：附：promise与async await结合使用总结学习过程中遇到的一些基础的Promise、async、await面试题整理。 出题目的： 考察 Pr

学习过程中遇到的一些基础的Promise、async、await面试题整理。

出题目的：

  • 考察 Promise、async、await 的基础
  • 考察队Event Loop、宏任务、微任务的理解

知识点：

  • js 执行顺序：单线程，自上而下、先同步后异步、先微任务后宏任务
  • new promise() -> Promise.resolve()，触发then
  • new promise((reject)=>{reject()}) -> promise.reject()，触发catch
  • then 和 catch 内部没有 throw new Error 相当于 resolve
  • async function 相当于返回 Promise.resolve()
  • await 后面的代码都是异步的，微任务；setTimeout是宏任务
  • 初始化Promise时，函数内部代码会被立即执行

代码：

考点1：Promise.resolve、Promise.reject执行顺序

Promise.resolve().then(() => {  // 优先寻找then
		console.log(1);
	}).catch(() => {
		console.log(2);
	})
	// 1

Promise.reject().then(() => {  // 优先寻找catch
		console.log(1);
	}).catch(() => {
		console.log(2);
	})
	// 2

考点2：then 和 catch 内部没有 throw new Error() 相当于 resolve

Promise.resolve().then(() => {
		console.log(1);
	}).catch(() => {
		console.log(2);
	}).then(() => {
		console.log(3);
	})
	// 1 3

Promise.reject().then(() => {
		console.log(1);
	}).catch(() => {
		console.log(2);
	}).then(() => {
		console.log(3);
	})
	// 2 3

Promise.reject().then(() => {
		console.log(1);
	}).catch(() => {
		console.log(2);
		throw new Error();
	}).then(() => {
		console.log(3);
	})
	// 2 报错

Promise.reject().then(() => {
		console.log(1);
	}).catch(() => {
		console.log(2);
		throw new Error();
	}).then(() => {
		console.log(3);
	}).catch(() => {
		console.log(4);
	})
	// 2 4

考点3：async function -> 相当于返回一个 Promise.resolve

const res = async function fn() {
	return 100;
}
console.log(res());  // 返回一个resolve状态的Promise对象 Promise {<fulfilled>: 100}
res().then(()=>{
	console.log(0);
}).catch(()=>{
	console.log(1);
})
// 0

(async function () {
	const a = fn();
	const b = await fn();
	console.log(a);  // Promise {<fulfilled>: 100}
	console.log(b);  // 100
})()

考点4： await 代码执行顺序

async function fn1() {
	console.log("fn1 start");
	await fn2();
	console.log("fn1 end");
}
async function fn2() {
	console.log("fn2 start");
}
console.log("start");
fn1();
console.log("end");


async function fn1() {
	console.log("fn1 start");
	await fn2();
	console.log("fn1 end");
	await fn3();
	console.log("fn3 end");
}
async function fn2() {
	console.log("fn2");
}
async function fn3() {
	console.log("fn3");
}
console.log("start");
fn1();
console.log("end");

考点5：Promise 与 setTimeout 执行顺序

console.log("start");
setTimeout(()=>{
	console.log("setTimeout")
});
Promise.resolve().then(()=>{
	console.log("Promise")
})
console.log("end")


async function fn1() {
	console.log("fn1 start");
	await fn2();
	console.log("fn1 end");  // await后面的代码为"微任务代码"
}
async function fn2() {
	console.log("fn2");
}
console.log("start");
setTimeout(()=>{
	console.log("setTimeout");  // 宏任务 
});
fn1();
console.log("end");

附：promise与async await结合使用

昨天看了一道字节外包的面试题

 const list = [1, 2, 3];
    const square = num => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve(num * num);
            }, 1000);
        });
    }
    function test() {
        // 修改这里的代码
        list.forEach(async x => {
            const res = await square(x);
            console.log(res);
        });
    }
    test()

需要修改的是把同步执行的数组替换成换成异步打印。

在测试以后我们可以-验证，forEach和for循环不同的是for循环可以修改数组的值，且forEach取不到具体某一项的值，这里的异步说的是每执行一次数组循环，就执行一步test()方法，

const list = [1, 2, 3];
const square = num => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(num * num);
        }, 1000);
    });
}
 function test() {
  for(let x of list) {
    var res = await square(x)
    console.log(res)
  }
}
test()

总结

到此这篇关于es6中Promise、async和await面试题整理的文章就介绍到这了,更多相关ES6 Promise、async、await面试题内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网！

--结束END--

本文标题: ES6中Promise、async和await面试题整理

本文链接: https://lsjlt.com/news/197085.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • ES6中Promise、async和await面试题整理
    目录出题目的：知识点：代码：附：promise与async await结合使用总结学习过程中遇到的一些基础的Promise、async、await面试题整理。 出题目的： 考察 Pr...
    99+
    2023-02-22
    es6 promise async es6 async await es6中的promise
  • ES6中Promise、async和await面试题实例代码分析
    这篇“ES6中Promise、async和await面试题实例代码分析”文章的知识点大部分人都不太理解，所以小编给大家总结了以下内容，内容详细，步骤清晰，具有一定的借鉴价值，希望大家阅读完这篇文章能有所收获，下面我们一起来看看这篇“ES6中...
    99+
    2023-07-05
  • 前端常见面试题之async/await和promise的区别
    目录asyncasync函数定义作用async 函数中 return 值如何接受方式一方式二awaitawait定义作用关于await的注意点[[promiseValue]][pro...
    99+
    2024-04-02
  • ES6中的Promise对象与async和await方法详解
    目录Promise封装的ajaxasync和await方法promise存在的意义：解决异步回调地狱问题三种状态：pending（进行中）、fulfilled（已成功）、reject...
    99+
    2022-12-29
    Promise对象与async和await方法 Promise与async和await
  • es6中await和async有哪些作用
    今天小编给大家分享一下es6中await和async有哪些作用的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们...
    99+
    2024-04-02
  • Javascript中promise,async和await的区别是什么
    本文小编为大家详细介绍“Javascript中promise,async和await的区别是什么”，内容详细，步骤清晰，细节处理妥当，希望这篇“Javascript中promise,async和await的区别是什么”文章能帮助大家解决疑惑...
    99+
    2023-06-29
  • async/await与promise（nodejs中的异步操作问题）
    举例写文章详情页面的时候的一个场景：首先更改文章详情中的 PV，然后读取文章详情，然后根据文章详情中文章 Id 查阅该文章评论和该文章作者信息。获取全部数据之后渲染文章详情页。数据库操作都是异步的，最直接想...
    99+
    2022-06-04
    操作 await async
  • koa2中使用async 、await、promise解决异步问题的示例分析
    这篇文章给大家分享的是有关koa2中使用async 、await、promise解决异步问题的示例分析的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。关键词：async 、awai...
    99+
    2024-04-02
  • JS中Promise面试题有哪些
    这篇文章给大家分享的是有关JS中Promise面试题有哪些的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。JavaScript是什么JS是JavaScript的简称，它是一种直译式的脚本语言，其解释器被称为Java...
    99+
    2023-06-14
  • NodeJs中怎么使用async和await处理异步
    NodeJs中怎么使用async和await处理异步，很多新手对此不是很清楚，为了帮助大家解决这个难题，下面小编将为大家详细讲解，有这方面需求的人可以来学习下，希望你能有所收获。场景远古时代我们在编写exp...
    99+
    2024-04-02
  • java常见面试题整理
    面向对象的特征有哪些方面 所谓封装，也就是把客观事物封装成抽象的类，并且类可以把自己的数据和方法只让可信的类或者对象操作，对不可信的进行信息隐藏。封装是面向对象的特征之一，是对象和类概念的主要特性。 （推荐学习：java常见面试题）继承...
    99+
    2016-08-28
    java面试题 java
  • python基础面试题整理
    Python基础语法相关 一、Python中的pass语句的作用是什么？ pass语句什么也不做，一般作为占位符 或者创建站位程序，pass语句不会不执行任何操作。 二、Py...
    99+
    2024-04-02
  • 2020面试必知：中高级工程师面试题集整理（题目+答案）
    这些面试题是我准备换工作的时候整理，没有重点。包括java基础，数据结构，网络，Android相关等等。...
    99+
    2023-06-04
  • 吐血整理60个Redis面试题
    1.Redis 是一个基于内存的高性能key-value数据库。 2.Redis相比memcached有哪些优势： memcached所有的值均是简单的字符串，redis作为其替代者，支持更为丰富的数据类型 redis的速...
    99+
    2017-12-10
    吐血整理60个Redis面试题
  • R语言常见面试题整理
    尊敬的读者，这些R语言面试题是专门设计的，以便您应对在R语言相关面试中可能会被问到的问题。 根据我的经验，良好的面试官几乎不打算在你的面试中问任何特定的问题，通常都是以如下的问题为开...
    99+
    2024-04-02
  • 2019-2020年Android最新整理面试题
      1.Activity生命周期(这个是必问的)   onCreate()：表示Activity正在被创建，常用来初始化工作，比如调用setContentView加载界面布局资...
    99+
    2022-06-06
    面试题 面试 Android
  • Oracle面试题及答案超全整理
    目录1.mysql和oracle的区别：2.Oracle中function和procedure的区别？ 3. 比较truncate和delete命令 ？ 4.oralce中 row...
    99+
    2023-04-19
    Oracle数据库面试 oracle试题及答案解析 oracle题库及答案
  • 网络安全工程师面试题整理
    “1.拿到一个待检测的站，你觉得应该先做什么？”, 通过站长之家收集域名whois 通过nmap 御剑查找服务器系统版本 通过google hack 进一步探测网站的信息通过google hack 和...
    99+
    2023-09-17
    android 前端 后端
  • 【面试】Java面试频繁问到的题最新整理（附答案）
    文章目录 一、Java基础部分面试题1.1. Java面向对象的三个特征1.2. Java中基本的数据类型有哪些 以及他们的占用字节1.3. int和Integer的区别1.4. String、StringBuilder、Strin...
    99+
    2023-08-30
    java 面试
  • 精心整理总结的Python自动化测试面试题
    目录1、自动化代码中,用到了哪些设计模式2、什么是断言( Assert) 3、什么是web自动化测试4、什么是Selenium？5、写出Selenium中你最熟悉的接口或类6、元素定...
    99+
    2023-02-17
    python自动化测试面试题 python面试题
软考高级职称资格查询
热门wiki
近期文章
推荐阅读
热门问答
热门标签
编程网，编程工程师的家园，是目前国内优秀的开源技术社区之一，形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容，为IT开发者提供了一个发现、使用、并交流开源技术的平台。

  • 官方手机版

  • 微信公众号

  • 商务合作