资讯专栏INFORMATION COLUMN

js的回调函数与异步

CntChen / 2339人阅读

摘要:首先要知道的是,回调和异步不是同一个东西我以前认为中每个回调函数都是异步处理的,实际上并不是,可以同步回调,也可以异步回调例子说到,大家都在中遇到以下的例子这些代码用了这么久,知道怎么用,但是可能对回调的概念并不是那么清晰再来个例子执行函数

首先要知道的是,回调和异步不是同一个东西
我以前认为js中每个回调函数都是异步处理的,实际上并不是,可以同步回调,也可以异步回调

callback 例子

说到callback,大家都在javascript中遇到以下的例子

$("#id").on("click", function(){
    //code
});
$("#id").setTimeout(function(){
    //code
},1000);

这些代码用了这么久,知道怎么用,但是可能对回调的概念并不是那么清晰

再来个例子

function a(callback) 
{
    alert("执行parent函数a!"); 
    alert("开始调用回调函数"); 
    callback(); 
    alert("结束回调函数"); 
}

function b(){ 
    alert("执行回调函数b"); 
} 

function test() 
{ 
   a(b);
   a(function() { 
        alert("执行匿名回调函数"); 
   }); 
}
test();

执行顺序:
执行parent函数a!
开始调用回调函数
执行回调函数b
结束回调函数

执行parent函数a!
开始调用回调函数
执行匿名回调函数
结束回调函数

callback 原理

简单的说,就是把一个函数作为形参进行传递,上面的callback参数可以改为任意名字

callback 用 C++ 实现 不带参数回调
#include 
using namespace std; 

//定义回调函数
void Print() 
{
    cout <<"Hello World!
";
}

//定义实现回调函数的"调用函数"
void Call(void (*callback)())
{
    callback();
}

//在main函数中实现函数回调
int main(int argc,char* argv[])
{
    Call(Print);
    return 0;
}
带参数回调
#include 
using namespace std; 

//定义带参回调函数
void Print(string s) 
{
   cout << s << endl;
}

//定义实现带参回调函数的"调用函数"
void Call(void (*callback)(string),string s)
{
    callback(s);
}

//在main函数中实现带参的函数回调
int main(int argc,char* argv[])
{
    Call(Print,"Hello World!");
    return 0;
}
异步例子

经典例子

function a(){
    console.log("执行a");
    setTimeout(function(){
        console.log("setTimeout");
    }, 1000);
}

function b(){
    console.log("执行b");
}

a();
b();

执行顺序:
执行a
执行b
setTimeout (一秒后执行)

异步原理

都知道js是单线程的,所谓的单线程就是一次只能完成一个任务,其任务的调度方式就是排队,毫无疑问,这样的效率是不高的,后面的任务必须等到前面的任务执行完毕后才能执行,如果有一个比较耗时的操作,比如http请求,文件io
其他语言遇到这种比较耗时的任务往往是开一个线程来处理,但js本身就是单线程的,js对这种任务的处理就是这个一个任务挂载起来,等耗时任务完成后再把回调函数添加到执行队列尾部
所以,在刚刚这个例子中,即使把延迟时间设置为0,也是一样的结果

本文同步更新我的个人博客https://blog.yjqing.xin/js-ca...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/99211.html

相关文章

  • 同步异步异步回调

    摘要:同步与异步以上为同步代码,函数必须等函数执行完毕后才能执行。异步回调产生的结果就是,函数的调用并不直接返回结果,而往往是交给回调函数进行异步处理。 同步与异步: function a(){} function b(){} a(); b(); 以上为同步代码,函数b必须等函数a执行完毕后才能执行。 function a(){ ...

    dinfer 评论0 收藏0
  • 异步

    摘要:在异步机制中,任务队列就是用来维护异步任务回调函数的队列。四对象对象是工作组提出的一种规范,目的是为异步编程提供统一接口。 异步 1.JavaScript单线程的理解 Javascript语言的执行环境是单线程(single thread)。所谓单线程,就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。 2.JavaScript单线...

    goji 评论0 收藏0
  • JS异步回调、高阶函数

    摘要:而是在调用发出后,被调用者通过状态通知来通知调用者,或通过回调函数处理这个调用。请求程序发出请求,从服务器端获取数据,并设置了回调函数。然后,浏览器会设置侦听来自网络的响应,拿到数据后,将该回调函数插入到事件循环。 并发与并行 并发是指两个或多个事件链随时间发展交替执行,以至于从更高的层次来看,就像是同时运行(但在任意时刻只处理一个事件) 并发的关键是你有处理多个任务的能力,不一定同...

    Dean 评论0 收藏0
  • Promise学习总结

    摘要:引擎线程也称为内核,负责处理脚本程序例如引擎引擎线程负责解析脚本,运行代码。对象代表一个未完成但预计将来会完成的操作。注意一旦新建就会立即执行它属于,无法取消。 写在前面: 第一遍学Promise时, 只是大概过了一遍, 感觉学的不够深入, 这一篇算是对之前的一个总结吧. Promise在ES6中也属于一个较难理解的一部分; 所以在学习一个比较难理解的知识点时, 我们可以围绕这个知识点...

    twohappy 评论0 收藏0
  • 总结:JavaScript异步、事件循环消息队列、微任务宏任务

    摘要:单线程异步非阻塞然后,这又牵扯到了事件循环消息队列,还有微任务宏任务这些。此步的位置不确定某个时刻后,定时器触发线程通知事件触发线程,事件触发线程将回调函数加入消息队列队尾,等待引擎线程执行。 前言 Philip Roberts 在演讲 great talk at JSConf on the event loop 中说:要是用一句话来形容 JavaScript,我可能会这样: Java...

    qianfeng 评论0 收藏0
  • JS 异步实现

    摘要:由于引擎同一时间只执行一段代码这是由单线程的性质决定的,所以每个代码块阻塞了其它异步事件的进行。这意味着浏览器将等待着一个新的异步事件发生。异步的任务执行的顺序是不固定的,主要看返回的速度。 我们经常说JS是单线程的,比如node.js研讨会上大家都说JS的特色之一是单线程的,这样使JS更简单明了,可是大家真的理解所谓JS的单线程机制吗?单线程时,基于事件的异步机制又该当如何,这些知识...

    sihai 评论0 收藏0

发表评论

0条评论

CntChen

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<