Javascript异步编程方法总结

简介: 现在我们有三个函数,f1, f2, f3 按正常的思路我们会这样写代码: function f1 (){}; function f2 (){}; function f3 (){}; //在这里调用函数 f1(); f2(); //假如这个函数会执行很长时间 f3();   但是假如我们f2这个函数在执行的时候会花费大量时间,或者直接就进入了一个死循环了,那我们的f3就别指望能被调用了,因为Javascript语言的执行环境是"单线程"(single thread)。

现在我们有三个函数,f1, f2, f3

按正常的思路我们会这样写代码:

function f1 (){};
function f2 (){};
function f3 (){};
//在这里调用函数
f1();
f2(); //假如这个函数会执行很长时间
f3();

  但是假如我们f2这个函数在执行的时候会花费大量时间,或者直接就进入了一个死循环了,那我们的f3就别指望能被调用了,因为Javascript语言的执行环境是"单线程"(single thread)。

所谓"单线程",就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。

  为了应对这样的事情,我们就有了异步模式编程;

方法一:回调方法实现异步编程

  要点:setTimeout 和 setInterval这两个定时器默认都是异步模式执行

  我们把代码写成这样:

 1 function f1 (){};
 2 function f2 (callback){
 3   setTimeout(function(){
 4     callback();
 5   },1000)
 6   //f2的代码在这里执行
 7   //如果把setTimeout放到末尾,依然要等f2执行完才能被触发
 8 };
 9 function f3 (){};
10 //在这里调用函数
11 f1();
12 f2( f3() ); //f3函数是以参数的形式传入,它在f2开始执行1s后开始执行f3函数

 

方法二:事件监听

这种方式是采用事件驱动模式。即任务的执行不取决于代码的顺序,而取决于某个事件是否发生

 

目录
相关文章
|
11月前
|
前端开发 JavaScript
JavaScript异步编程:告别回调地狱的优雅方案
JavaScript异步编程:告别回调地狱的优雅方案
|
10月前
|
前端开发 JavaScript
JavaScript中的Async/Await:简化异步编程
JavaScript中的Async/Await:简化异步编程
489 109
|
10月前
|
前端开发 JavaScript API
JavaScript异步编程:从Promise到async/await
JavaScript异步编程:从Promise到async/await
702 204
|
12月前
|
JavaScript Linux 内存技术
Debian 11系统下Node.js版本更新方法详解
本指南详细介绍在Linux系统中安装和管理Node.js的步骤。首先检查现有环境,包括查看当前版本和清除旧版本;接着通过NodeSource仓库安装最新版Node.js并验证安装结果。推荐使用nvm(Node Version Manager)进行多版本管理,便于切换和设置默认版本。同时,提供常见问题解决方法,如权限错误处理和全局模块迁移方案,以及版本回滚操作,确保用户能够灵活应对不同需求。
1450 0
|
11月前
|
前端开发 JavaScript
JavaScript异步编程:从回调地狱到Async/Await
JavaScript异步编程:从回调地狱到Async/Await
|
11月前
|
前端开发 JavaScript
JavaScript异步编程:从回调地狱到Async/Await优雅进化
JavaScript异步编程:从回调地狱到Async/Await优雅进化
|
11月前
|
前端开发 JavaScript
JavaScript异步编程:从回调地狱到优雅解决方案
JavaScript异步编程:从回调地狱到优雅解决方案
|
11月前
|
前端开发 JavaScript
JavaScript异步编程:从Callback到Async/Await的进化
JavaScript异步编程:从Callback到Async/Await的进化