JS中让异步执行的方法同步执行

最新推荐文章于 2025-03-19 00:30:37 发布
最新推荐文章于 2025-03-19 00:30:37 发布
阅读量3.4k 收藏 8
点赞数 7
文章标签： javascript 开发语言 ecmascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_52993798/article/details/134031434
版权

js中的方法默认是异步执行的，但是有时候我们有需要同步的执行一些方法，这时就需要用到async和await来进行操作，使得函数内部的方法同步执行，本人为小后端一枚，前端的一些知识体系理解不够细致，难免有疏漏，希望大家多多包涵，但是方法是可行的。

1.先看会异步执行的函数

这是要调用的方法

控制台输出顺序

function2

function1

2.添加async 和await后变成同步

2.1 在方法名前加上async关键字

2.2 在需要等待的方法前加上 await（await 需要一个promise对象，在没有等到promise对象执行完毕，它会阻断该函数后面代码的执行）

2.3 将方法体用Promise对象包起来

2.4 返回resolve

这时看控制台输出为

function1

function2

阳阳华子
关注
JS同步执行、异步执行、及同步中的异步执行
wjianwei666的专栏
04-24 234
微观任务是在当前JS调用执行完了之后立刻执行的，是同步的，在同一个调用栈里，没有多线程异步，如这里包括promise.then在内的setTimeout回调里的代码都是在DOMTimer.Fired执行的，只是说then被放到了当前要执行的整一个异步回调函数的最后面执行。难道是异步任务执行的顺序不是前后顺序，而是另有规定？在JS执行中都是单线程执行，所以代码的执行可以说是自上而下，如果前一段的代码出现问题，就会导致下一段代码无法执行，对于用户而言就是卡死现象，所以在JS执行机制引出了异步执行操作。
深入理解 JS 引擎执行机制（同步执行、异步执行以及同步中的异步执行）
01-22 1685
首先明确两点： 1.JS 执行机制是单线程。 2.JS的Event loop是JS的执行机制，深入了解Event loop，就等于深入了解JS引擎的执行。 单线程执行带来什么问题？ 在JS执行中都是单线程执行，所以代码的执行可以说是自上而下，如果前一段的代码出现问题，就会导致下一段代码无法执行，对于用户而言就是卡死现象，所以在JS执行机制引出了异步执行操作。 那异步能解决...
JS异步编程同步化
ice_teas的博客
01-14 793
问题背景 同步是指一件事一件事的执行，只有前一个任务执行完毕，才能执行后一个任务。 异步(async)是相对于同步(sync)而言的，由于JavaScript是单线程运行的，为了避免阻塞带来的糟糕体验，异步操作成了必不可少的一种编程模式，js实现异步操作的方式有很多，包括回调函数、时间监听、发布/订阅模式、定时函数，包括ES6及以后的promise，Generator函数及各种语法糖。 这里...
js文件引用方式及其同步执行与异步执行
最新发布
m0_57307213的博客
03-19 781
同步加载适用于需要依赖该文件中的代码执行结果的情况，而异步加载适用于不需要依赖该文件中的代码执行结果的情况，可以优化页面加载速度。
js异步控制器，实现异步同步代码交替穿插执行
学习使我快乐_玉祥
09-08 927
当然要让标识1的任务主动通知，设置检查函数，每一个标识1的任务结束后都主动调用检查函数，发现全部执行完毕后，就开始调用标识2的任务，这样就实现了异步串行了。第三种方法，需要定义全局变量，标记每个异步函数的执行结果状态，定义全局容器收集异步函数执行结果，定义全局检查函数检查执行结果状态，然后在每一个异步函数的完成的时候修改该状态，并且调用检查方法，在全部结束的时候表示异步函数结果收集完成。但js有个概念：事件驱动。最后创建一个任务中心，用来提供对外接口，将任务封装成一个个任务，组成任务组，控制启动结束等等。
JavaScript编程技巧：将异步方法转换为同步执行的实用方法
terence的博客
06-06 8410
当在JavaScript中处理异步操作时，我们通常会使用来简化异步代码的编写和理解。然而，有时候我们可能需要将异步方法转换为同步执行的方法，以满足特定的需求。在本篇博客中，我们将详细讨论如何将异步方法转换为同步执行的方法。
js的执行机制同步异步
dd的博客
03-21 970
是单线程三. process.nextTick与setImmediate方法(1) process.nextTick(2) setImmediate四.事件循环(1) 运行栈(2) 任务队列(3) 事件循环五.宏任务和微任务(1) 宏任务(2) 微任务六. promise和async函数(1) promise函数(2) async函数七. 测试题。将vscode右击----属性---兼容性---管理员运行。这里使用@符号时，要加。的时间过长，这样就会造成页面的渲染不连贯，导致页面渲染加载阻塞的感觉。
js代码同步执行
w19981225的博客
04-18 4247
【代码】js代码同步执行。
async/await让异步操作同步执行的方法详解
12-13
总之，`async/await`为JavaScript的异步编程提供了一种更直观的解决方案，它降低了异步代码的复杂性，使得代码更接近同步执行的思维方式，从而提高了代码的可读性和可维护性。在处理复杂的异步流程控制时，使用`...
D3.js中强制异步文件读取同步的几种方法
10-20
通过这种方式，可以将异步的读取操作转变为同步执行，从而减少异步操作可能带来的问题。 4. 利用AngularJS的$watch函数，将依赖于数据变化的操作注册为观察者，当数据发生变化时触发相应操作。AngularJS提供了一套...
Nodejs让异步变成同步的方法
10-17
Node.js中让异步操作变成同步的方法通常是指将非阻塞的异步调用改写为在逻辑上表现得像同步调用的方式。Node.js中异步操作是通过回调函数、Promises和async/await等技术来实现的。以下我们详细讲解如何通过这些方法...
js 实现 同时调用两个方法
03-30
js 实现 同时调用两个方法! 值得下载看看!资源免费,大家分享!!
浅谈js文件引用方式及其同步执行与异步执行
10-21
本文将详细探讨JavaScript文件的不同引用方式，以及它们的同步执行与异步执行之间的差异和使用场景。 首先，最常见的JavaScript文件引用方式是在HTML文档中直接引用。例如，在HTML文件中的`<script>`标签内写入...
JS里如何将多个异步调用转同步调用
weixin_44058446的博客
11-23 7391
本文介绍如何在js里将多个异步调用优雅地转同步调用，可适用于vue, node.js等编程
【js】异步方法同步化
楚峡云归的博客
03-04 748
【阿楚JavaScript知识点】异步方法同步化背景实现思路实现过程总结 背景 最近刷知乎的时候使用到了返回顶部的功能，跟我以前写的直接将滚动条滑动到顶部不太一样。知乎的 滚动条是由慢到快加速度慢慢滚动上去的。于是我见猎心喜，琢磨着自己也实现一个这样的功能。毕竟以前是直接控制滚动条定位到顶部这样跳转太突兀了。 实现思路 于是我开始了对知乎返回顶部功能进行反复尝试，总结出了思路： 知乎的返回顶部是 有停顿时间的，有一个肉眼可见的停顿，并不是直接定位 返回的速度是由慢到快 逐步加速 的 实现过程 实现
JavaScript： 异步代码同步执行
Hr_ving的博客
11-09 872
在学会异步代码如何同步执行之前，需要先了解两个知识。
js的同步执行
本作者：想花
07-28 5838
几个知识点 代码中的异步、同步概念 异步是代码中的多个代码块同时执行，没有先后顺序。 同步是按照代码的上下左右顺序，从上往下执行，从左往右执行。执行完上一行的代码才会执行下一行。 异步同步的命名方式貌似是根据cpu的时钟顺序来命名的。 线程b的执行依赖于线程a执行结束，就是说线程a结束时间和线程b开始时间是一样的即同步时间。 线程a和b若没有先后那么线程a和b的执行时间也没必要一致，即异步时间 浏览器或者nodejs执行js代码机制 因为前端页面的大部分动作依赖于js代码，通常我们使用Goo
js中的同步执行
qq3892997的博客
05-17 5887
async function aaa(xxx){ 如果aaa方法返回的不是一个promise对象那么就需要在使用then方法的调用方法定义上加上 async使它返回一个promise默认，这样就可以使用then了，否则会报错 } aaa(xxx).then(function(data){ data是aaa方法的返回值，也就是这个方法体一定会等aaa这个方法执行完毕之后再执行 }); ...
JS中异步和同步的执行机制
zebghfv的博客
07-11 629
什么是同步、异步？ 同步：必须这件事情做完了才能进行下一件事情。 异步：不必要等这件事请做完，可以先干其他事情。 为什么JavaScript是单线程的？ 主要原因就是避免dom渲染的冲突，因为JS可以访问dom节点且可对节点进行操作。比如：如果JS是多线程的，那么它在同一时刻就可以刚多件事情，假如A事件在对一个节点进行渲染，而B事件又想删除该节点，岂不是就产生了冲突，为了避免这种冲突，所以JS就被设计为单线程的，所以同一时间就只能干一件事情。 单线程意味着一个时刻只能干一件事情，那么遇到同步代码和异步代码，
js让同步等待异步执行
11-23
JavaScript是一种单线程语言，这意味着在一个时刻它只能执行一个任务。当你有异步操作，比如网络请求或定时器，它们不会阻塞主线程，而是按照事件循环模型（Event Loop）执行。如果你需要让同步代码等待异步操作完成，你可以使用以下几种方法： 1. **回调函数**：这是最直接的方式，将异步操作作为另一个函数的参数，在异步操作完成后调用这个参数，执行后续代码。 ```javascript function fetchData(callback) { // 异步操作 setTimeout(() => { const data = 'some data'; callback(data); }, 1000); } fetchData(result => { console.log(result); // 等待1秒后打印数据 }); ``` 2. **Promise**：Promise是一个表示异步操作最终完成（成功或失败）的对象。可以链式调用`.then`和`.catch`方法来处理异步结果。 ```javascript function fetchData() { return new Promise((resolve, reject) => { setTimeout(() => resolve('data'), 1000); }); } fetchData() .then(data => console.log(data)) // 等待1秒后打印数据 .catch(err => console.error(err)); ``` 3. **async/await**：这是一种更现代化的语法糖，基于Promise。使用`async`关键字声明异步函数，内部的`await`表达式会暂停函数直到Promise解析。 ```javascript async function fetchData() { try { const data = await new Promise(resolve => setTimeout(resolve, 1000, 'data')); console.log(data); } catch (err) { console.error(err); } } fetchData(); ```
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值