JS回调函数 callback的理解与使用案例分析

本文实例讲述了JS回调函数 callback的理解与使用。分享给大家供大家参考，具体如下：

基本理解一个概念

回调函数回头再调用函数，等主干事情干完了，再回头干分支上的事情。

官方定义

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.

实例1

//定义主函数，回调函数作为参数
function A(callback) {
  callback();
  console.log('我是主函数');
}
//定义回调函数
function B(){
  setTimeout("console.log('我是回调函数')", 3000);//模仿耗时操作
}
//调用主函数，将函数B传进去
A(B);

输出结果：

我是主函数
我是回调函数

实例2

function a() {
  console.log("执行a函数");
  setTimeout(function(){
      console.log("执行a函数的延迟函数");
  },1000);
  function b() {
    console.log("执行函数b");
  );
  a();
  b();
};

输出结果

以上代码会先执行函数a,而且不会等到a中的延迟函数执行完才执行函数b, 在延迟函数被触发的过程中就执行了函数b,当js引擎的event 队列空闲时才会去执行队列里等待的setTimeout的回调函数，这就是一个异步的例子

调用 setTimeout 函数会在一个时间段过去后在队列中添加一个消息。这个时间段作为函数的第二个参数被传入。如果队列中没有其它消息，消息会被马上处理。但是，如果有其它消息，setTimeout 消息必须等待其它消息处理完。因此第二个参数仅仅表示最少的时间 而非确切的时间

所以即使，时间设置为0，也是会照样先执行函数b

结语

回调函数广泛运用在同步（sync）和异步（async）

常见的：

还需要深挖：js单线程和js异步

浏览器常驻三大线程: js引擎线程，GUI渲染线程，浏览器事件触发线程

更多关于JavaScript相关内容可查看本站专题：《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

赞 (0)

相关推荐

  • 原生JS实现动态加载js文件并在加载成功后执行回调函数的方法

    原生JS实现动态加载js文件并在加载成功后执行回调函数的方法

    本文实例讲述了原生JS实现动态加载js文件并在加载成功后执行回调函数的方法.分享给大家供大家参考,具体如下: 有的时候需要动态加载一个javascript文件,并且在加载成功后执行回调函数(例如文件中保存了json数据之类的).要实现这样的功能,可以使用<script> 元素的load 事件(IE9+.chrome.FireFox等)和onreadystatechange 事件(IE8以下),直接上代码: function loadScript(src, callback) { var scr

  • 理解javascript中的回调函数(callback)

    最近在看 express,满眼看去,到处是以函数作为参数的回调函数的使用.如果这个概念理解不了,nodejs.express 的代码就会看得一塌糊涂.比如: 复制代码 代码如下: app.use(function(req, res, next) {     var err = new Error('Not Found');     err.status = 404;     next(err); }); app是对象,use是方法,方法的参数是一个带参的匿名函数,函数体直接在后面给出了.这段代码

  • 告诉你什么是javascript的回调函数

    函数也是对象 想弄明白回调函数,首先的清楚地明白函数的规则.在javascript中,函数是比较奇怪的,但它确确实实是对象.确切地说,函数是用Function()构造函数创建的Function对象.Function对象包含一个字符串,字符串包含函数的javascript代码.假如你是从C语言或者java语言转过来的,这也许看起来很奇怪,代码怎么可能是字符串?但是对于javascript来说,这很平常.数据和代码之间的区别是很模糊的. //可以这样创建函数 var fn = new Functio

  • javascript 自定义回调函数示例代码

    如果你直接在函数a里调用的话,那么这个回调函数就被限制死了.但是使用函数做参数就有下面的好处:当你a(b)的时候函数b就成了回调函数,而你还可以a(c)这个时候,函数c就成了回调函数.如果你写成了functiona(){...;b();}就失去了变量的灵活性. 复制代码 代码如下: function a(index,callback){ callback(index); } function b(index){ alert(index); } a(10000,b);

  • js中回调函数的学习笔记

    回调函数是什么在学习之前还真不知道js回调函数怎么使用及作用了,下面本文章把我在学习回调函数例子给各位同学介绍一下吧,有需了解的同学不防进入参考. 回调函数原理: 我现在出发,到了通知你" 这是一个异步的流程,"我出发"这个过程中(函数执行),"你"可以去做任何事,"到了"(函数执行完毕)"通知你"(回调)进行之后的流程 例子 1.基本方法 <script language="javascript&q

  • ajax JSONP请求处理回调函数jsonpCallback区分大小写

    使用ajax进行 JSONP跨域请求,因为被请求的对方的回调函数名称是无法修改.而这边页面中会出现多个不同JSONP请求,但他们的回调函数名称都是同一个,_Callback.想到设置AJAX 的JSONP参数.但是发现根本不起作用.最后偶然发现 jsonpcallback是区分大小写的.必须是 jsonpCallback 而不是jsonpcallback 复制代码 代码如下: $.ajax({ url: 'http://www.zbphp.com/j.php?act=json&tm=', dat

  • 关于javascript 回调函数中变量作用域的讨论

    1.背景 Javascript中的回调函数,相信大家都不陌生,最明显的例子是做Ajax请求时,提供的回调函数, 实际上DOM节点的事件处理方法(onclick,ondblclick等)也是回调函数. 在使用DWR的时候,回调函数可以作为第一个或者最后一个参数出现,如: JScript code function callBack(result){ } myDwrService.doSomething(param1,param2,callBack);//DWR的推荐方式 //或者 myDwrSer

  • JavaScript callback回调函数用法实例分析

    本文实例讲述了JavaScript callback回调函数用法.分享给大家供大家参考,具体如下: 在使用开源项目的时候经常会使用到回调函数,如果把回调函数弄清楚了,那么对我们深入了解开源项目会有很大帮助. 回调函数百度百科的解释: 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数.回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应.

  • js 异步操作回调函数如何控制执行顺序

    需求: fun A() { asyn(parm1, parm2, onsuccess(){ }) ;} fun B() {asyn(paem1, parm2, onsuccess(){}) ;} 函数B要求执行在函数A之后 异步执行 如果直接使用 A(); B(); 是不能够满足执行条件的. 考虑将B作为回调函数传递给A,然后A再执行的onsucess中执行B函数 A(B); 即可实现功能需求. js是单线程的. 1.调用函数时,如果参数多于定义时的个数,则多余的参数将会被忽略,如果少于定义时的

  • JS回调函数 callback的理解与使用案例分析

    本文实例讲述了JS回调函数 callback的理解与使用.分享给大家供大家参考,具体如下: 基本理解一个概念 回调函数回头再调用函数,等主干事情干完了,再回头干分支上的事情. 官方定义 A callback is a function that is passed as an argument to another function and is executed after its parent function has completed. 实例1 //定义主函数,回调函数作为参数 func

  • JS回调函数深入理解

    JS回调函数深入理解

    本文实例讲述了JS回调函数.分享给大家供大家参考,具体如下: 一.前奏 在谈回调函数之前,先看下下面两段代码: 不妨猜测一下代码的结果. function say (value) { alert(value); } alert(say); alert(say('hi js.')); 如果你测试了,就会发现: 只写变量名  say   返回的将会是 say方法本身,以字符串的形式表现出来. 而在变量名后加()如say()返回的就会使say方法调用后的结果,这里是弹出value的值. 二.js中函数

  • javascript回调函数的概念理解与用法分析

    本文实例讲述了javascript回调函数的概念理解与用法.分享给大家供大家参考,具体如下: 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为函数实际上是一种对象,它可以存储在变量中,通过参数传递给另一个函数,在函数内部创建,从函数中返回结果值",因为函数是内置对象,我们可以将它作为参数传递给另一个函数,到函数中执行,甚至执行后将它返回,它一直被"专业的程序员"

  • JS回调函数基本定义与用法实例分析

    本文实例讲述了JS回调函数基本定义与用法.分享给大家供大家参考,具体如下: 初学js的时候,被回调函数搞得很晕,现在回过头来总结一下什么是回调函数. 我们先来看看回调的英文定义:A callback is a function that is passed as an argument to another function and is executed after its parent function has completed. 字面上的理解,回调函数就是一个参数,将这个函数作为参数传到

  • JS回调函数简单易懂的入门实例分析

    JS回调函数简单易懂的入门实例分析

    本文实例讲述了JS回调函数.分享给大家供大家参考,具体如下: 初学js的时候,被回调函数搞得很晕,现在回过头来总结一下什么是回调函数.什么是JS?(点击查看) 下面先看看标准的解释: <script language="javascript"> function SortNumber( obj, func ) // 定义通用排序函数 { // 参数验证,如果第一个参数不是数组或第二个参数不是函数则抛出异常 if( !(obj instanceof Array) || !(f

  • JS回调函数简单用法示例

    JS回调函数简单用法示例

    本文实例讲述了JS回调函数简单用法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>testCallBack.html</title> </head> <body> <

  • C++中回调函数(CallBack)的用法分析

    本文实例分析了C++中回调函数(CallBack)的用法.分享给大家供大家参考.具体分析如下: 如果试图直接使用C++的成员函数作为回调函数将发生错误,甚至编译就不能通过. 其错误是普通的C++成员函数都隐含了一个传递函数作为参数,亦即"this"指针,C++通过传递this指针给其成员函数从而实现程序函数可以访问C++的数据成员.这也可以理解为什么C++类的多个实例可以共享成员函数却-有不同的数据成员.由于this指针的作用,使得将一个CALL-BACK型的成员函数作为回调函数安装时

  • JS回调函数原理与用法详解【附PHP回调函数】

    本文实例讲述了JS回调函数原理与用法.分享给大家供大家参考,具体如下: JS回调函数 何为回调函数,官方解释:当程序跑起来时,一般情况下,应用程序(application program)会时常通过API调用库里所预先备好的函数.但是有些库函数(library function)却要求应用先传给它一个函数,好在合适的时候调用,以完成目标任务.这个被传入的.后又被调用的函数就称为回调函数(callback function). 通常将一个函数B传入另一个函数A,并且在需要的时候再调用函数A. 说白

  • JavaScript回调函数callback用法解析

    这篇文章主要介绍了JavaScript回调函数callback用法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 JavaScript回调函数的使用是很常见的,引用官方回调函数的定义: A callback is a function that is passed as an argument to another function and is executed after its parent function has complete

  • js回调函数原理与用法案例分析

    本文实例讲述了js回调函数原理与用法.分享给大家供大家参考,具体如下: 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数.回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应. 函数指针是指向函数的指针变量. 因此"函数指针"本身首先应是指针变量,只不过该指针变量指向函数. 函数指针有两个用途:调用函数和做函数的参数. 作用:

随机推荐