Promise面试题

promise与 fetch、async/await_fetch async 获取结束标志-CSDN博客

手写promise A+、catch、finally、all、allsettled、any、race-CSDN博客

【建议星星】要就来45道Promise面试题一次爽到底(1.1w字用心整理) - 掘金

目录

每隔1秒输出1,2,3

红黄绿灯交替亮

按序执行数组

异步加载图片


每隔1秒输出1,2,3

const arr = [1, 2, 3]
arr.reduce((p, x) => {return p.then(() => {return new Promise(r => {setTimeout(() => r(console.log(x)), 1000)})})
}, Promise.resolve())

红黄绿灯交替亮

function red() {console.log("red");
}
function green() {console.log("green");
}
function yellow() {console.log("yellow");
}
const light = function (timer, cb) {return new Promise(resolve => {setTimeout(() => {cb()resolve()}, timer)})
}
const step = function () {Promise.resolve().then(() => {return light(3000, red)}).then(() => {return light(2000, green)}).then(() => {return light(1000, yellow)}).then(() => {return step()})
}step();

按序执行数组

const time = (timer) => {return new Promise(resolve => {setTimeout(() => {resolve()}, timer)})
}
const ajax1 = () => time(2000).then(() => {console.log(1);return 1
})
const ajax2 = () => time(1000).then(() => {console.log(2);return 2
})
const ajax3 = () => time(1000).then(() => {console.log(3);return 3
})function mergePromise (ajaxArray) {// 存放每个ajax的结果const data = [];let promise = Promise.resolve();ajaxArray.forEach(ajax => {// 第一次的then为了用来调用ajax// 第二次的then是为了获取ajax的结果promise = promise.then(ajax).then(res => {data.push(res);return data; // 把每次的结果返回})})// 最后得到的promise它的值就是datareturn promise;
}mergePromise([ajax1, ajax2, ajax3]).then(data => {console.log("done");console.log(data); // data 为 [1, 2, 3]
});// 要求分别输出
// 1
// 2
// 3
// done
// [1, 2, 3]

异步加载图片

function loadImg(url) {return new Promise((resolve, reject) => {const img = new Image();img.onload = function() {console.log("一张图片加载完成");resolve(img);};img.onerror = function() {reject(new Error('Could not load image at' + url));};img.src = url;});

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/3226.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Flink 实时数仓(一)【实时数仓离线数仓对比】

前言 昨天技术面的时候,面试官说人家公司现在用的都是最新的技术,比如 Doris 等一些最新的工具,确实这些课是学校永远不会开设的,好在他说去了会带着我做一做。可是 ...... 学院舍不得让走啊 ...... 没办法,情况就是这…

img 图片加载失败后展示本地展示

Vue3 图片预览实现网络图片请求失败后加载本地图片 html 代码&#xff1a; <img v-if"logo" :src"imgSrc" error"handleError" />script 代码&#xff1a; import localImg from /assets/logo.pngconst networkImg https://img1.baidu.…

python代码报错requests.exceptions.SSLError

直接浏览器访问报ssl错误的网站&#xff0c;然后找到证书&#xff0c;选择导出 然后在cmd里面执行&#xff0c;去查看certifi的位置 python -c "import certifi;print(certifi.where())"找到之后用文本编辑器打开&#xff0c;我用的vscode 滚动到最后面&#xff0c…

长期供应KLM8G1GETF-B041 存储芯片

长期供应各品牌芯片&#xff1a; H58GG6MK6GX037 BK1005HS601-T BKP1005HS221-T MMUN2233LT1G GJM0335C1ER70BB01D NCP115ASN180T2G CC0402KRX5R6BB224 GRM033R71A472KA01D MMSZ4678T1G MMSZ4686T1G MMSZ4691T1G MMSZ4704T1G MMSZ5243BT1G MMSZ4709T1G GRM1555C…

DPDK UDP通信

1. 编译运行程序 环境配置&#xff1a; win10 运行 socket 客户端工具 Linux DPDK 运行 UDP 程序 注意事项&#xff1a; DPDK 跳过内核协议栈&#xff0c;所以 ARP 协议也不支持&#xff0c;需要手动在 win10 上配置静态 arp 地址&#xff0c;保证数据包发到网卡。 netsh i i …

什么是重放攻击(Reply attack)?

什么是重放攻击(Reply attack)? 重放攻击&#xff0c;也称为回放攻击&#xff0c;是一种网络攻击方式。重放攻击是一种中间人攻击&#xff0c;攻击者通过截获合法的数据传输并重新发送它们来欺骗接收方&#xff0c;让接收方误以为是合法的消息。重放攻击是非常常见的&#xf…

在IDEA中使用.env文件导入系统配置的图文教程

JetBrains的IDEA是一款功能强大的集成开发环境&#xff0c;为开发人员提供了丰富的功能和工具。使用.env文件来管理配置信息在IDEA中非常简单。 旧版本默认支持&#xff0c;新版本idea需要安装插件才可以。 这里我们可以安装EnvFile插件&#xff0c;步骤如下&#xff1a; 在弹…

BarTransitions

NavigationBarTransitions的作用 BarTransitions 有以下7中模式&#xff1a; public static final int MODE_TRANSPARENT 0; 全透明public static final int MODE_SEMI_TRANSPARENT 1; 半透明public static final int MODE_TRANSLUCENT 2;public static final int MODE_LIG…

详解数仓的向量化执行引擎

前言 适用版本&#xff1a;【基线功能】 传统的行执行引擎大多采用一次一元组的执行模式&#xff0c;这样在执行过程中CPU大部分时间并没有用来处理数据&#xff0c;更多的是在遍历执行树&#xff0c;就会导致CPU的有效利用率较低。而在面对OLAP场景巨量的函数调用次数&#x…

ctfshow web29-web40

命令执行 看清都过滤了些什么&#xff01;&#xff01; 知识点&#xff1a; web34&#xff1a;当;和()被过滤了就用语言结构&#xff0c;一般有echo print isset unset include require web37&#xff1a;data协议是将后面的字符串当成php代码执行&#xff0c;例如 /?cdat…

JVM学习笔记(四)类加载与字节码技术

目录 一、类文件结构 二、字节码指令 2.3 图解方法执行流程 1&#xff09;原始 java 代码 2&#xff09;编译后的字节码文件 3&#xff09;常量池载入运行时常量池 4&#xff09;方法字节码载入方法区 5&#xff09;main 线程开始运行&#xff0c;分配栈帧内存 6&…

python语音版东北方言小词典

目录 一.前言 二.代码 三.分析 一.前言 东北方言是中国境内最为特色和独特的方言之一,它主要分布在中国东北地区的吉林、辽宁和黑龙江省。这个地区被称为“东北三省”,所以也被称为“东北话”或“东北官话”。 东北方言与普通话(官话)有着明显的差异,包括发音、词汇…

甘特图是什么?如何利用其优化项目管理流程?

甘特图是项目管理软件中十分常见的功能&#xff0c;可以说每一个项目经理都要学会使用甘特图才能更好的交付项目。什么是甘特图&#xff1f;甘特图用来做什么&#xff1f;简单来说一种将项目任务与时间关系直观表示的图表&#xff0c;直观地展示了任务进度和持续时间。 一、甘特…

【C++】string类的增删改查模拟实现(图例超详细解析!!!)

目录 一、前言 二、string类的模拟实现 ✨前情提要 ✨Member functions —— 成员函数 ⚡构造函数 ⚡拷贝构造函数 ⚡赋值运算符重载 ⚡析构函数 ✨Element access —— 元素访问 ⚡operator[ ] ⚡Iterator —— 迭代器 ✨Capacity —— 容量 ⚡size ⚡capacity ⚡clea…

井字棋源码(网络线程池版)

源码链接&#xff1a;game 效果可能没有那么好&#xff0c;大家可以给点建议。 效果展示 game.h #include <stdio.h> #include <stdlib.h> #include <time.h>#define ROW 3 #define COL 3void InitBoard(char board[ROW][COL], int row, int col) {int i…

企业数字化转型,“业务”先行

在当今时代&#xff0c;数字化转型已经成为企业发展的必经之路。数字化转型&#xff0c;简而言之&#xff0c;就是运用数字技术&#xff0c;对企业运营管理的各个环节进行深度改造&#xff0c;以提升企业的运营效率和市场竞争力。据有关机构研究测算&#xff0c;数字化转型可使…

丈母娘眼中“靠谱女婿”职业榜曝光,公务员跌落榜首,新兴职业成宠儿!

正如婆婆和媳妇相处很复杂&#xff0c;丈母娘和女婿亦有着微妙关系&#xff0c;看对眼是“半个儿”&#xff0c;不对付则会成为小两口婚姻的“地雷”&#xff0c;甚至是恋爱路上的“拦路虎”。 近来&#xff0c;最新丈母娘认可的“靠谱女婿”职业榜排行新鲜出炉&#xff0c;备受…

R语言 数据的整理与清洗(Data Frame 篇下)

《Cookbook for R》 Manipulating Data ~ Dataframe Comparing data frames 比较数据框 当你想比较两个或多个数据框&#xff0c;并从中找到&#xff1a; 1、重复出现在多个数据框中的行 2、或仅出现在一个数据框中的行 先构建三个示例数据框 dfA <- data.frame(Subjectc…

5g工业数采网关是什么?-天拓四方

随着工业4.0时代的到来&#xff0c;数字化、网络化、智能化成为工业发展的新趋势。在这个过程中&#xff0c;5G工业数采网关作为一种关键设备&#xff0c;发挥着越来越重要的作用。本文将详细解析5G工业数采网关是什么&#xff0c;以及它在工业领域中的应用和重要性。 一、5G工…

MySql CPU激增原因分析

QPS激增会导致CPU占用升高 分析 可以使用监控工具&#xff0c;查看CPU利用率曲线图和QPS曲线图进行对比。如果CPU曲线图波动情况跟QPS曲线图波动情况基本保持一致&#xff0c;可以明确明确CPU升高时QPS上升导致。反之&#xff0c;CPU曲线图对比QPS曲线图有不同步的峰值抖动&am…