在同步函数中等待Promise.all,基本上是阻塞的! javascript

2024-01-28

我有很多我想要执行的同步函数,之前是基本的ajax请求,这些请求将把html渲染到DOM。

为了做到这一点,我必须同步执行所有这些 一一要求。但我不知何故希望这些同步功能同时异步,并等待它们完成以加快速度。这必须发生在同步函数内。但我的理解是这在 javascript 中不起作用,但我想听听你们要说什么。

所以我的尝试是将所有这些同步请求添加到异步承诺中,然后进行 Promise.all 调用。我等不及 Promise.all().then 因为主线程将在这个主同步线程/函数之后继续执行其余的代码。所以我想知道是否有一种方法可以阻止主线程以等待这些异步调用

这是我正在谈论的内容的简短说明

var syncfunc = () => {
var getPromise = () => {
    return new Promise((resolve) => {
        var asyncAjaxRequest = async function() {
            doSomeStuff();
            resolve();
        }
    })
}
var promises = [getPromse(), getPromse(), getPromse()];


Promise.all(promises);

console.log('i want this console.log to execute after all promises executed doSomeStuff');

/**
 * 
 * Promise.all(promises).then(() => {
        // I cant use this, because its script in other files that will execute if i wait like this
    })
 */
}

我知道 .then 将在所有解析完成后执行,但我基本上想阻止此同步线程,等待所有其他异步完成。

如果可以的话,我当然会根据我的需要更改结构,但问题和我尝试这样做的原因是因为我使用 sitevision 框架,并且想要在打印模块打开打印窗口之前向 dom 添加一些内容。同步调用每个函数并不是正确的方法,它会很慢。我还尝试设置 window.print = null 来禁用打印功能,然后在 Promise 解析时将打印功能添加回来,但它根本不起作用


您无法使用纯 JavaScript(无需外部代码)将异步操作转变为同步操作。事件驱动的 JS 引擎并不是这样工作的。

根据定义,异步操作启动操作(将执行交给本机代码),然后返回到解释器,然后解释器继续执行后面的代码。当完成时,本机代码将向 JS 事件队列添加一个事件,以允许解释器事件循环为异步操作的完成提供服务。如果您创建某种“块”,例如半无限 while 循环,这将“阻止”解释器执行更多代码,那么您最终会陷入僵局。阻塞解释器的循环会阻止 JS 解释器处理指示异步操作结束的事件。因此,您有一个循环等待某件事完成,但它正在等待的事情在循环完成之前无法完成 - 僵局。

因此,由于 JS 解释器的单线程事件循环性质,您不能(纯粹在 Javascript 中)阻塞等待异步操作的结束。

几乎总是,正确的设计是重构周围的代码/基础设施以处理异步操作和异步结果(回调或承诺)。


如果这是 Node.js,有一些可怕的黑客可以让你得到这个结果,但它们会阻止整个解释器,所以几乎从来都不是理想的设计。

第一个选项涉及编写一个自定义 Nodejs 插件(在本机代码中完成的异步操作),该插件提供一个阻塞接口,该接口在操作完成之前不会返回。

第二个选项涉及使用同步子进程操作 https://nodejs.org/api/child_process.html#child_process_synchronous_process_creation(例如child_process.execFileSync()要创建阻塞子进程,请在该子进程中运行代码,然后在该进程完成后继续。

我认为这两者都是非常糟糕的黑客行为,而且几乎从来都不是解决此类问题的理想方法。但是,我确实想向您展示必须做什么才能阻止异步操作(必须将其移出 Javascript 或移出进程)。


如果您无法弄清楚如何通过非阻塞异步操作解决您的实际问题,我建议您发布一个新问题,在其中详细描述真正的问题是什么,我们可以帮助您找到异步设计这适合你的情况。如果您在此处的评论中发布指向新问题的链接,这里参与的一些人可能会检查新问题并尝试提供帮助。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在同步函数中等待Promise.all,基本上是阻塞的! javascript 的相关文章

  • 如何使用多个 select2 框过滤表格?

    我正在尝试使用 和多个 select2 框的类来过滤表格 表格 HTML table class table tbody tr class kanban event Austin td td tr tr class csm event Ch
  • JAVASCRIPT - 为什么这个对象没有改变?

    function myFunc theObject theObject make Ford model Focus year 2006 var mycar make Honda model Accord year 1998 var x my
  • jQuery:查找具有特定自定义属性的元素

    我只想找到具有特定自定义属性值的元素 例如 我想找一个div其具有属性data divNumber 6 var number 6 var myDiv data divNumber number 我尝试使用http api jquery co
  • 以下文档我无法创建 Vue.js 3 的实例

    The code https stackblitz com edit vue ttt file src main js https stackblitz com edit vue ttt file src main js 问题 我正在尝试在
  • 如何将 Ajax.BeginForm MVC 助手与 JSON 结果一起使用?

    我正在尝试使用 ASP NET MVC Ajax BeginForm 帮助程序 但不想在调用完成时使用现有的内容插入选项 相反 我想使用自定义 JavaScript 函数作为回调 这可行 但我想要的结果应该以 JSON 形式返回 不幸的是
  • Django Ajax ModelForm 向 request.POST 提交一个空表单

    对于 django ajax 和 jquery 我是个新手 所以如果我的问题显得微不足道 我提前道歉 我已经在这个问题上摸不着头脑有一段时间了 但我正在尝试使用 ajax 和 jquery 通过 jQuery UI 提供的模式对话框窗口提交
  • onClick 处理程序在每个渲染周期触发

    我有这样的默认状态 this state selectedTab tab1 then 我的渲染方法是这样的 render const selectedTab this state return li tab1 li li tab2 li d
  • Apache Thrift Java-Javascript 通信

    我正在编写一个基于 Apache Thrift 的 Java 服务器 它将从 Javascript 客户端接收数据 我已经完成了 Java 服务器 但问题是我可以获得 Javascript 客户端的工作示例 我无法找到一个好的示例 构建文档
  • 如何将一个数组中的所有项目复制到另一个数组中?

    如何将数组的每个元素 其中元素是对象 复制到另一个数组中 以便它们完全独立 我不想更改一个数组中的元素来影响另一个数组 这里的关键是 数组中的条目是对象 并且 您不希望对一个数组中的对象的修改显示在另一个数组中 这意味着我们不仅需要将对象复
  • jquery 中的函数返回未定义[重复]

    这个问题在这里已经有答案了 我在 jquery 中调用的函数返回未定义 我检查了该函数 当我对其进行调试时 它返回正确的数据 function addToPlaylist component type add to pl value pl
  • 返回视图作为 JSON 对象的一部分

    我有一个应用程序只加载一次完整视图 我这样做的原因并不重要 重要的是 其余内容只会以部分视图的形式返回 除了一些内容之外 我还有一些 JSON 对象 我想通过每个 AJAX 请求在服务器之间来回传递 有没有办法返回一个 JSON 对象 并将
  • 播放没有音频标签的音频

    是否可以在没有音频标签的情况下仅使用 javascript 播放音频 我通过 tinyMce 编辑器注入脚本 因为我无权访问网站的后端 并且它不支持客户端的音频标签 她只想要当您将鼠标悬停在图像上时发出简单的声音 我已经完成了所有设置 但是
  • 如何知道 .keyup() 是否是字符键(jQuery)

    如何知道 keyup 是否是字符键 jQuery input keyup function if key is a character such as a b A b c 5 3 2 etc not enter key or shift o
  • ES6 模块范围

    我有代码 lib js var a a export var b b main js console log a a variable is not available in a global scope import b from lib
  • Svelte 条件元素类报告为语法错误

    我正在做一个if块每if 块的精简指南 https svelte technology guide if blocks 这看起来很简单 但 Svelte 认为这是一个语法错误 svelte plugin ParseError Unexpec
  • 从网页运行 ClickOnce 应用程序,无需用户操作

    我们有一个基于 Java 的 Web 应用程序以及用 C 编写的相同应用程序 如果 java 检查器发现客户端计算机上没有安装 Java 则应该运行该应用程序 这个想法是运行 C 单击一次 http en wikipedia org wik
  • 如何在 React Native 中使用相同的 Firebase 数据库在两个应用程序之间进行通信?

    我有两个不同的应用程序使用相同的实时数据库 在第一个应用程序中 我发送的订单包含一些要保存在数据库中的数据字段 在另一个应用程序中 我只添加一个侦听器 firebase database ref userOrder currentUser
  • 如何在 TypeScript 中使用 navigation.replace ?

    我试图在我的代码中使用它 const navigation useNavigation navigation replace AllFriends 但我不断收到错误消息 Property replace does not exist on
  • 如何跨多个文件跨越 javascript 命名空间?

    我永远忽略了javascript 几年前我开始使用 jQuery 这样我就可以过得去 但随着我开始更多地进行 TDD 我昨天决定真正深入研究 javascript 之后可能还有咖啡脚本 在我的 ASP NET Web 窗体应用程序中 我有很
  • 为什么 JavaScript 中是 [1,2] + [3,4] = "1,23,4" ?

    我想将一个数组的元素添加到另一个数组中 所以我尝试了以下方法 1 2 3 4 它的回应是 1 23 4 到底是怎么回事 The 操作员没有为数组定义 发生的事情是 JavaScript将数组转换为字符串并将它们连接起来 Update 由于这

随机推荐