- 综合排序
- 最热优先
- 最新优先
- 来自专栏前端二次元
JavaScript——异步进阶
本期介绍JS 的特色就是异步编程，所有有很多关于异步的考点，本章都会讲解。如 event loop、promise、async-await、微任务和宏任务。学不会这些，就不算是精通 JS。 event loop，也叫事件循环/事件轮询，JS是单线程运行的，从前到后，一行一行执行，如果某一行执行报错，则停止下面的代码执行，先把同步代码执行完，再执行异步，异步要基于回调来实现，event loop 就是异步回调的实现原理。 callback hell（回调地狱），Promise then catch 链式调用，但也是基于回调函数，async/await是用同步语法编写异步代码，是同步语法，彻底消灭回调函数，是异步写法的最佳解决方式 ，是消灭异步回调的终极武器。
41210编辑于 2023-11-23 - 来自专栏大数据
JavaScript进阶-Promise与异步编程
在JavaScript开发中，异步编程是绕不开的一环，而Promise作为解决异步问题的重要工具，自ES6起便成为开发者手中的利器。 本文旨在深入浅出地解析Promise的基本概念、常见应用场景、易错点及其规避策略，并辅以代码示例，帮助你更稳健地驾驭异步编程。 Promise基础 什么是Promise？ setTimeout(reject, 800, '超时')) ]).then(data => { // ... }).catch(error => { // 处理超时或失败 }); 总结 Promise是JavaScript 异步编程的核心之一，掌握其基本原理和高级用法对于提高代码质量至关重要。 通过识别并避免上述易错点，结合async/await等现代语法特性，可以使异步逻辑变得更加清晰和易于管理。不断实践，逐步深入理解异步编程模型，将使你在面对复杂异步流程时更加游刃有余。
36510编辑于 2024-06-21 - 来自专栏技术分享交流
JavaScript专项算法题（4）：异步
异步 挑战一 sayHowdy 问题: 思考时间（现在暂时不需要编写代码）：分析下方挑战一的代码，打印出来的结果会是怎样顺序的？Howdy先还是Partnah先？ （译注：原题库网页上的按钮） 题解： / CHALLENGE 4 / function brokenRecord() { // ADD CODE HERE setInterval(()=>console.log
51220编辑于 2023-02-14 - 来自专栏代码编写世界
JavaScript异步编程4——Promise错误处理
概述 在上一篇文章《JavaScript异步编程3——Promise的链式使用》中，通过Promise的链式使用，避免程序中多次嵌套回调（回调地狱）。 前者通过Promise的then()处理异常，只会运行功能的回调函数和失败的回调函数其中的一个；后者通过catch()处理异常，则更加像JavaScript的try/catch，在try{}中发生的错误会立即转到 这样的话，就很容易实现类似于try/catch异常操作的的非阻塞异步版本： $(function () { function get(url) { return new 参考 JavaScript Promises: An introduction
98120发布于 2021-05-07 - 来自专栏阮一峰的网络日志
Javascript异步编程的4种方法
你可能知道，Javascript语言的执行环境是"单线程"（single thread）。 所谓"单线程"，就是指一次只能完成一件任务。 常见的浏览器无响应（假死），往往就是因为某一段Javascript代码长时间运行（比如死循环），导致整个页面卡在这个地方，其他任务无法执行。 为了解决这个问题，Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）。 "异步模式"非常重要。在浏览器端，耗时很长的操作都应该异步执行，避免浏览器失去响应，最好的例子就是Ajax操作。 本文总结了"异步模式"编程的4种方法，理解它们可以让你写出结构更合理、性能更出色、维护更方便的Javascript程序。 一、回调函数 这是异步编程最基本的方法。
92950发布于 2018-04-12 - 来自专栏coding个人笔记
JavaScript异步
所以JavaScript把任务分成了两种，一种是同步任务，另一种是异步任务。 ；再次期间形成的异步任务进入新的任务队列； 4、 主线程不断重复上面的步骤。 (function() { console.log( "3" ) }, 1000 ); setTimeout(function() { console.log( "4" ) }, 2000 ); setTimeout(function() { console.log( "5" ) }, 3000 ); console.log( "6" ); //1 6 2 3 4 5 每隔一秒就会有一个任务队列 异步其实挺简单的，可能本人刚开始进入了误区，理解异步可以让我们对于JavaScript的执行原理有一定的理解。 （完）
70210发布于 2020-04-23 - 来自专栏hotarugaliの技术分享
JavaScript异步操作
Promise.all()和Promise.race() 并行调用异步操作 两个函数均用于并行调用多个异步操作使用 All：两个异步操作都resolve之后调用then() var p1 = new Promise p1, p2]).then(function (results) { console.log(results); // 获得一个Array: ['P1', 'P2'] }); Race：最快的异步操作
63810编辑于 2022-03-01 - 来自专栏前端进阶之路
JavaScript异步编程
#前言 从我们一开始学习JavaScript的时候就听到过一段话：JS是单线程的，天生异步，适合IO密集型，不适合CPU密集型。 但是，多数JavaScript开发者从来没有认真思考过自己程序中的异步到底是怎么出现的，以及为什么会出现，也没有探索过处理异步的其他方法。到目前为止，还有很多人坚持认为回调函数就完全够用了。 但是，随着JavaScript面临的需求越来越多，它可以运行在浏览器、服务器、甚至是嵌入式设备上，为了满足这些需求，JavaScript的规模和复杂性也在持续增长，使用回调函数来管理异步也越来越让人痛苦 ，这一切，都需要更强大、更合理的异步方法，通过这篇文章，我想对目前已有JavaScript异步的处理方式做一个总结，同时试着去解释为什么会出现这些技术，让大家对JavaScript异步编程有一个更宏观的理解 Step4 - Async/Await 上面我们介绍了Promise和Generator，把这两者结合起来，就是Async/Await。
1.5K20发布于 2018-10-31 - 来自专栏前端学习文档
JavaScript 异步模式
source=cloudtencen 什么是异步模式？ 不会等待当前任务执行完毕，才会去执行下一个任务，这就是异步模式（Asynchronous）。 开启异步后，就会跳过本任务，开始执行下一个任务，后续的逻辑一般会通过回调函数的方式定义。 异步模式执行中，涉及到调用栈（Call stack）、消息队列（Queue）、微任务队列（Microtask Queue）、事件循环（Eevent Loop）、运行环境（浏览器是 WebAPIs）。 异步方案 ES2015 提供的 Pormise 方案 ES2015 提供的 Generator ES2017 提供的 Async / Await 语法糖（可以写出更扁平的异步代码） 基础案例 console.log
48420编辑于 2023-05-14 - 来自专栏ops技术分享
JavaScript 异步编程
异步的概念 异步（Asynchronous, async）是与同步（Synchronous, sync）相对的概念。 而异步的概念则是不保证同步的概念，也就是说，一个异步过程的执行将不再与原有的序列有顺序关系。 简单来理解就是：同步按你的代码顺序执行，异步不按照代码顺序执行，异步的执行效率更高。 以上是关于异步的概念的解释，接下来我们通俗地解释一下异步：异步就是从主线程发射一个子线程来完成任务。 为了解决这个问题，JavaScript 中的异步操作函数往往通过回调函数来实现异步任务的结果处理。 当然，JavaScript 语法十分友好，我们不必单独定义一个函数 print ，我们常常将上面的程序写成： 实例 setTimeout(function () { document.getElementById
83230发布于 2021-07-19 JavaScript 异步编程
异步的概念 异步（Asynchronous, async）是与同步（Synchronous, sync）相对的概念。 而异步的概念则是不保证同步的概念，也就是说，一个异步过程的执行将不再与原有的序列有顺序关系。 简单来理解就是：同步按你的代码顺序执行，异步不按照代码顺序执行，异步的执行效率更高。 以上是关于异步的概念的解释，接下来我们通俗地解释一下异步：异步就是从主线程发射一个子线程来完成任务。 为了解决这个问题，JavaScript 中的异步操作函数往往通过回调函数来实现异步任务的结果处理。 当然，JavaScript 语法十分友好，我们不必单独定义一个函数 print ，我们常常将上面的程序写成： 实例 setTimeout(function () { document.getElementById
15710编辑于 2025-12-16- 来自专栏HZFEStudio
JavaScript 异步编程
异步编程方案有哪些 JavaScript 异步编程方案各有什么优缺点 回答关键点 阻塞 事件循环 回调函数 JavaScript 是一种同步的、阻塞的、单线程的语言，一次只能执行一个任务。 "; document.body.appendChild(pElem); }); 异步回调是编写和处理 JavaScript 异步逻辑的最常用方式，也是最基础的异步模式。 但是随着 JavaScript 的发展，异步回调的问题也不容忽视： 回调表达异步流程的方式是非线性的，非顺序的，理解成本较高。 回调会受到控制反转的影响。 4. Promise Promise 提供了完成和拒绝两个状态来标识异步操作结果，通过 then 和 catch 可以分别对着两个状态进行跟踪处理。 6. async/await async/await 属于 ECMAScript 2017 JavaScript 版的一部分，使异步代码更易于编写和阅读。通过使用它们，异步代码看起来更像是同步代码。
1.4K00发布于 2021-10-30 - 来自专栏Android研究院
JavaScript 异步编程
❝掌握JavaScript主流的异步任务处理 ( 本篇文章内容输出来源:《拉钩教育大前端训练营》参阅《你不知道的JavaScript中卷》异步章节)❞ JavaScrip 采用单线程模式工作的原因，需要进行 异步模式 通过一个图来演示异步任务，用到事件循环与消息队列机制实现 ? 目前大部分异步回调作为宏任务 常见的宏任务与微任务如下图所示： ? Untitled 2.png 下面是JavaScript执行异步任务的执行时序图： ? Untitled 3.png 看下面的例子来进行理解: 下列例子中输出: 2 4 1 3 5 这其实也符合了上图事件循环的原理,先主任务执行输出: 2 4 之后查询是否有微观任务没有就新建宏观任务执行 console.log(time); 下面我们在看一个带有微任务的例子: 下面例子输出的结果: 2 4 6 1 3 5.主任务执行完毕之后先执行微任务. let time = 0;
1.5K10发布于 2020-07-31 - 来自专栏OECOM
javascript异步编程
简单来说，异步编程就是在执行一个指令之后不是马上得到结果，而是继续执行后面的指令，等到特定的事件触发后，才得到结果。 也正是因为这样，我们常常会说: JavaScript 是由事件驱动的。 在 JavaScript 中，Generator 的 function 与 函数名之间有一个 *， 函数内部使用 yield 关键词，定义不同的状态。 整个 Generator 函数就是一个封装的异步任务，或者说是异步任务的容器。异步操作需要暂停的地方，都用 yield 语句注明。Generator 函数的执行方法如下。 可以看到，虽然 Generator 函数将异步操作表示得很简洁，但是流程管理却不方便（即何时执行第一阶段、何时执行第二阶段） 4. await/async 这是在 ES 2016 中引入的新关键词，这将在语言层面彻底解决 JavaScript 的异步回调问题，目前可以借助 babel 在生产环境中使用。
79510发布于 2020-07-01 - 来自专栏Cellinlab's Blog
JavaScript Async (异步)
# 异步 事实上，程序中现在 运行的部分和将来 运行的部分之间的关系就是异步编程的核心。 # 异步控制台 并没有什么规范或一组需求指定 console.* 方法族如何工作——它们并不是 JavaScript 正式的一部分，而是由宿主环境添加到 JavaScript 中的。 换句话说，JavaScript 引擎本身并没有时间的概念，只是一个按需执行 JavaScript 任意代码片段的环境。“事件”（JavaScript 代码执行）调度总是由包含它的环境进行。 并行线程的交替执行和异步事件的交替调度，其粒度是完全不同的。 JavaScript 从不跨线程共享数据，这意味着不需要考虑这一层次的不确定性。但是这并不意味着 JavaScript 总是确定性的。 我们的顺序阻塞式的大脑计划行为无法很好地映射到面向回调的异步代码。这就是回调方式最主要的缺陷：对于它们在代码中表达异步的方式，我们的大脑需要努力才能同步得上。
92330编辑于 2023-05-17 - 来自专栏Krryblog
JavaScript 异步编程
博客地址：https://ainyi.com/96 众所周知，JavaScript 是单线程的，但异步在 js 中很常见，那么简单来介绍一下异步编程 同步编程和异步编程 同步编程，计算机一行一行按顺序依次执行代码 ；那么 JavaScript 单线程的异步编程可以实现多任务==并发执行== 重点实现 js 异步的方式，就是==事件循环==，之前写过关于事件循环的例子，可看：JavaScript 事件循环、异步和同步 首先 JavaScript 的同步任务是进入主线程的执行栈执行；异步任务则进入==消息队列(任务队列)==，一个存储着待执行任务的队列，严格按照时间先后顺序执行，排在队头的任务将会率先执行，而排在队尾的任务会最后执行 ，重复这个过程 [28.jpg] 简单来说：事件循环其实就是入栈出栈的循环 这样就能实现异步方式 js 的异步方式 setTimeout ajax Promise Generator setTimeout 即使将时间设置为 0，也会延迟执行，即异步执行。
87630发布于 2020-09-15 - 来自专栏ccylovehs
JavaScript异步编程
然后往下执行发现是promise.then回调函数，此为异步微任务，放入任务队列中，等待同步任务执行完才能执行 再往下执行是timeout定时器，此为异步宏任务，也放入任务队列中，等待同步任务执行完、异步微任务才能执行 再往下是foo方法，此为同步任务，借用网络流行的一句话 “JavaScript中的函数是一等公民”，打印日志start...后回调执行bar方法，到这里就有两个执行栈了（依次将foo、bar放入栈中， bar执行完就弹出栈，foo依次弹出） 关于并发模型和Event Loop 请看MDN（https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/EventLoop 大家是否有疑问，为啥不是先输出2再输出1 setTimeout与setInterval执行的间隔时间为4~5ms 下面看setInterval代码 ? 计数count输出为252,所以执行的间隔时间约为4ms 3.1.2.requestAnimationFrame 看看caniuser支持的情况 ?
1.2K20发布于 2018-09-14 - 来自专栏Super 前端
JavaScript异步编程
Javascript语言的执行环境是”单线程”（single thread）。所谓”单线程”，就是指一次只能完成一件任务。 Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）。 “异步模式”非常重要。 在浏览器端，耗时很长的操作都应该异步执行，避免浏览器失去响应，最好的例子就是Ajax操作。 在服务器端，”异步模式”甚至是唯一的模式，因为执行环境是单线程的，如果允许同步执行所有http请求，服务器性能会急剧下降，很快就会失去响应。 然而，异步执行最大的问题就是执行顺序。 , 1000); 这些操作不能在初始化的解析过程中完成的，也就是说在JavaScript代码运行的同时必须新启动一个解析器来解析新的代码。性能消耗较大。
64141发布于 2019-08-15 - 来自专栏XC's Blog 日常笔记
JavaScript 进阶
变量在未声明即被访问时会报语法错误 变量在var声明之前即被访问，变量的值为 undefined let / const 声明的变量不存在变量提升 变量提升出现在相同作用域当中 实际开发中推荐先声明再访问变量 函数进阶 展开运算符 (…)， 将一个数组进行展开，不会修改原数组 const arr=[1,2,3,4,5] console.log(...arr) //1 2 3 4 5 典型运用场景： 求数组最大值(最小值 )、合并数组等 const arr=[1,2,3,6,4,5] const arr2=[7,8,9] //最大值 const max=Math.max(...arr) //合拼 const arr3=[ 静态成员： 在 JavaScript 中底层函数本质上也是对象类型，因此允许直接为函数动态添加属性或方法，构造函数的属性和方法被称为静态成员。 在 JavaScript 内置了一些构造函数，绝大部的数据处理都是基于这些构造函数实现的，JavaScript 基础阶段学习的 Date 就是内置的构造函数。
1.8K20编辑于 2023-04-03 - 来自专栏神葳总局
JavaScript（进阶）
JavaScript的进阶学习笔记 # 正则表达式 正则用来定义一些字符串的规则，程序可以根据这些规则来判断一个字符串是否符合规则， 也可以将一个字符串中符合规则的内容提取出来。 btn = document.getElementById("btn"); btn.onclick = function(){ }; </script> </body> 1 2 3 4 var btn = document.getElementById("btn"); btn.onclick = function(){ }; }; </script> 1 2 3 4 例子： 元素.事件 = function(event){ event = event || window.event; event.cancelBubble = true; }; 1 2 3 4 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 复制 ---- # JSON JavaScript
1.8K20发布于 2021-01-22
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号