setTimeout模拟请求，使用async和await改写的一些注意地方

最新推荐文章于 2024-07-30 14:05:53 发布
最新推荐文章于 2024-07-30 14:05:53 发布
阅读量3.6k 收藏 5
点赞数 3
分类专栏： js学习总结
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41033048/article/details/114979233
版权
本文介绍了如何使用setTimeout模拟异步数据请求，并通过Promise与async/await进行处理。重点讨论了在使用await时必须配合new Promise及resolve()的调用，以及如何抽离重复代码。同时提供了一个包含互相调用关系的请求例子，展示了async和await的正确应用步骤。
摘要由CSDN通过智能技术生成

通过定时器模拟异步数据请求并引入promise处理的方法过程。

一、依次输出1,2,3

setTimeout(() => {
   
        console.log(1);
        setTimeout(() => {
   
                console.log(2);
                setTimeout(() => {
   
                        console.log(3);
                }, 1000);
        }, 1000);
}, 1000);

二、通过promise处理这些请求

new Promise((res, rej) => {
   
        setTimeout(() => {
   
                res();
        }, 1000);
}).then(() => {
   
        console.log(1);
        return new Promise((res, rej) => {
   
                setTimeout(()
最低0.47元/天 解锁文章
叶川飞流
关注
  • 3
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
用 setTimeout 模拟异步操作和async/await操作
weixin_40945354的博客
05-29 1243
/** * 传入参数 n，表示这个函数执行的时间（毫秒） * 执行的结果是 n + 200，这个值将用于下一步骤 */ function takeLongTime(n) { return new Promise(resolve => { setTimeout(() => resolve(n + 200), n); }); } function step1(n) { console.log(`step1 with ${n}`); return
给 setTimeout、setInterval 配备 await 写法
大概关于
04-23 3208
setTimeout、setInterval 是两个常用的异步函数。 但作为异步函数，他们不支持 Promise或者 async/await写法。 代码写起来： setTimeout(() => { console.log('执行一些操作') setTimeout(() => { console.log('执行另一些操作') // setTimeout ... }, 3000) }, 1000) 不好看！ 尽管经过简单的封装，可以达到目的，但每次用到都封装一次——重
setTimeout 可以 await吗
m0_57236802的博客
05-14 771
在 JavaScript 中，setTimeout函数本身不返回一个 Promise，因此它不能直接与await关键字一起使用，因为await是用于等待一个 Promise 解决。然而，你可以通过包装setTimeout在一个 Promise 中来使其可await，从而在async函数中按预期工作。
settimeout,promise,async的区别
最新发布
qq_53911056的博客
07-30 243
setTimeout在指定多少秒后执行一个函数，主要用于延迟执行代码，不直接处理异步操作的结果。Promise提供了处理异步操作成功或失败的方法，并通过链式调用支持复杂的异步流程控制。async/await建立在Promise之上，提供了更加简洁和直观的异步编程语法。
读 ECMAScript 6 笔记 ( 四 )
flybird
06-28 154
异步加载与setTimeout执行顺序const promise = new Promise(function(resolve, reject) {  // ... some code  if (true){    resolve(value);  } else {    reject(error);  }});console.log(1);setTimeout(function(){  cons...
Promise Async-await setTimeOut
qq_55729551的博客
08-30 758
async function async1() { console.log("async1 start"); await async2(); console.log("async1 end"); } async function async2() { console.log( 'async2'); } console.l...
java await async_用 async/await 来处理异步（转）
weixin_29133981的博客
02-19 250
昨天看了一篇vue的教程，作者用async/ await来发送异步请求，从服务端获取数据，代码很简洁，同时async/await 已经被标准化，是时候学习一下了。先说一下async的用法，它作为一个关键字放到函数前面，用于表示函数是一个异步函数，因为async就是异步的意思， 异步函数也就意味着该函数的执行不会阻塞后面代码的执行。 写一个async 函数async function timeout...
Js中process.nextTick，setImmediate，setTimeout，Promise.then，async/await终极异步执行顺序全解析
codingWeb的博客
09-28 1287
虽然大家知道async/await，但是很多人对这个方法中内部怎么执行的还不是很了解 await做了什么处理 从字面意思上看await就是等待，await 等待的是一个表达式，这个表达式的返回值可以是一个promise对象也可以是其他值。 很多人以为await会一直等待之后的表达式执行完之后才会继续执行后面的代码，实际上await是一个让出线程的标志。await后面的函数会先执行一遍，然后就会跳出整个async函数来执行后面js栈后面的代码。等本轮事件循环执行完了之后又会跳回到async函数中等待await
异步Promise及Async/Await详解
qq_15859173的博客
12-21 718
一、为什么有Async/Await？ 我们都知道已经有了Promise的解决方案了，为什么还要ES7提出新的Async/Await标准呢？ 答案其实也显而易见：Promise虽然跳出了异步嵌套的怪圈，用链式表达更加清晰，但是我们也发现如果有大量的异步请求的时候，流程复杂的情况下，会发现充满了屏幕的then，看起来非常吃力，而ES7的Async/Await的出现就是为了解决这种复杂的情况。 首先，我们必须了解Promise。 二、Promise简介 2.1 Promise实例 什么是Promise，很多人应该
详细介绍async await 含义,使用,原理
weixin_43730446的博客
03-02 663
async 函数 就是将 Generator 函数的星号（*）替换成 async,将 yield 换成await
一道setTimeout async promise执行顺序的笔试题引发的思考
weixin_34038293的博客
12-04 221
====据说这是今日头条去年的一道笔试题，主要考察的是setTimeout async promise执行顺序 ～先双手奉上这道题目～ async function async1() { console.log("async1 start"); await async2(); ...
JavaScrip(JS) 使用异步(async/await)函数方法 setTimeout实现定时递归调用
weixin_52026996的博客
06-15 866
本文主要介绍JavaScrip(JS)中，使用 setTimeout或await sleep通过异步(async)函数方法实现递归调用和async 和 await的基本含义及使用，以及相关的示例代码。
setTimeout与async/await
weixin_40945354的博客
05-29 416
function takeLongTime() { return new Promise(resolve => { setTimeout(() => resolve("long_time_value"), 3000); }); } takeLongTime().then(v => { console.log("got", v); }); [Running] node "/Users/ivyone/44.js" got long_time_valu
vue多个等待几秒再执行，可以用await加setTimeout实现
myforr的博客
10-03 5236
所以后面用async+await（里面setTimeout）就可以了。上面这样连续两个，第一个setTimeout不执行。用的vue，刚开始一直想只用setTimeout。因为要等await返回结果才往下面执行。
async、await、promise、setTimeout关于宏任务和微任务
追风筝的人
04-15 3313
async、await、promise、setTimeout关于宏任务和微任务
高级之路篇十八：setTimeout、Promise、async、await
HuaiCheng9067的博客
05-10 439
setTimeout setTimeout函数用来指定某个函数或某段代码，在多少毫秒之后执行。它返回一个整数，表示定时器的编号，以后可以用来取消这个定时器。 var timerId = setTimeout(func|code, delay) clearTimeout(timerId); timerId = null; 注意点： 1、定时器回调函数的this指向； 2、延迟执行时间受...
setTimeout async promise执行顺序总结
qq_29055201的博客
12-19 378
async function async1() { console.log(“async1 start”); await async2(); console.log(“async1 end”); } async function async2() { console.log(‘async2’); } console.log(“script start”); setTimeout(function ...
使用 async await + setTimeout 分割 while 循环
liuyaqi1993的博客
03-27 5822
由于JavaScript单线程的特性，在执行CPU密集型任务时（如大数组排序）会阻塞网页的渲染，解决办法一般是使用setTimeout函数对任务进行分割，或者把这类任务交由 web worker 处理。今天遇到一个对大数组排序的问题，需要使用任务分割来避免阻塞，在这里记录下我的实现方法。在实现时我将 while 语句进行了分割，避免出现大循环体语句一直进行计算，主要代码如下： // ...
settimeout,promise,async/await
03-16
settimeout：是JavaScript中的一个函数，用于在指定的时间后执行一段代码。 promise：是一种异步编程的解决方案，用于处理异步操作的结果。 async/await：是ES2017中的新特性，用于简化异步编程，使代码更易读、易维护。async用于定义一个异步函数，await用于等待异步操作的结果。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值