上一节我们学习了JS里的void关键字,本节我们将学习JS里的异步编程。

异步编程

异步编程是指在执行某些耗时操作时,不让程序停下来等待,而是继续执行后续代码,等耗时操作完成后再回来处理结果的一种编程方式。

为什么会出现异步编程?因为JS是单线程的,如果所有操作都同步执行,遇到网络请求、文件读取等耗时操作时,页面就会卡住无法响应。异步编程解决了这个问题,让程序在等待期间还能处理其他任务。

比如延迟执行定时器就是一个典型的异步编程:

setTimeout(function(){
  alert('10s后我就出现了!')
},10000)

这里我设置了一个10秒后执行的定时任务,但程序不会在此等待10秒,而是立即继续执行后续代码;10秒时间到达后,浏览器会通过回调机制触发alert弹窗。这种“先设定、后执行、不等待”的模式,就是异步编程的核心思想——在等待某个操作完成期间,不阻塞主线程的执行。

我们可以来一个玩一个小游戏,看看读者是否掌握异步编程的思想:

6s后点击按钮,读者能猜到控制台会输出什么吗?

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
<button onclick="f()">按钮</button>
</body>
<script>
function f(){
  console.log(3);
  
}
console.log(1);
setTimeout(function f(){
  console.log(2);
  
},5000)
</script>
</html>

答案是:1、2、3。

分析:代码会先同步输出1,然后设置一个5秒后执行的定时器,但程序不会等待这5秒,而是继续执行后续代码(此处没有更多同步代码,主线程进入空闲);当用户点击按钮时,会立即同步输出3;而无论点击发生在何时,定时器都会在5秒到期时自动输出2。这清晰地展示了异步机制——定时任务被安排到未来执行,完全不阻塞主线程对用户点击等即时事件的响应。

总结:本节我们主要学习异步编程的思想,其核心是"时不我",主线程如果阻塞则异步快速跳转下一个任务,以实现最大效率做事。

点赞(0)

C语言网提供由在职研发工程师或ACM蓝桥杯竞赛优秀选手录制的视频教程,并配有习题和答疑,点击了解:

一点编程也不会写的:零基础C语言学练课程

解决困扰你多年的C语言疑难杂症特性的C语言进阶课程

从零到写出一个爬虫的Python编程课程

只会语法写不出代码?手把手带你写100个编程真题的编程百练课程

信息学奥赛或C++选手的 必学C++课程

蓝桥杯ACM、信息学奥赛的必学课程:算法竞赛课入门课程

手把手讲解近五年真题的蓝桥杯辅导课程

Dotcpp在线编译      (登录可减少运行等待时间)