本文实例讲述了JS中的回调函数。分享给大家供大家参考,具体如下:

在说回调函数之前,不妨先看一段代码,相信有点js基础的同学都能明白他的含义:

1
2
3
document.getElementById('demo').click=function(){
  alert(1);
};

这段代码其实就是一段事件回调,这样写看的其实相对模糊一些,我们不妨看下接下来的代码

1
2
3
document.getElementById('demo').addEventListener('click',function(){
    alert(1)
});

这两段代码的所做的事情其实相同,不同的只是写法的差异,我们看这个addEventListener('eventName',callback)addEventListener这个函数有两个参数,第一个为事件名称,第二个参数实际上就是回掉函数,按照书上来说回调函数的方式,函数中的参数既然可以是变量,那么他也可以是一个函数。可能说到这里大家对回掉函数还是一脸懵逼。我们再看接下来这个例子。

1
2
3
4
5
6
7
function demo(a,b,callback){
    let c=a+b;
    callback(c);
};
demo(1,2,function(c){
    alert(c);//3
})

这段代码定义了一个demo函数,这个函数有三个参数a,b,callback,我们在这个函数内部声明了一个局部变量c,然后执行我们的callback(回调函数),接下来执行demo这个函数

这个函数的三个参数如上,在回掉函数中弹出的为3。这就是一个简单的回调函数。而要想真正理解回调函数的意义,其实我觉得还是在于明白他的用途,只有明白他的用途了我们才可以真正的去理解他。

回调函数最多的应用场景就是异步操作,因为异步的操作我们不知道这个操作到底何时结束,那么我们后续执行的代码就无法按照应有的流程走下去。

JS中的回调函数实例浅析的更多相关文章

  1. js中的回调函数的理解和使用方法

    js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...

  2. js中的回调函数的理解

    一,常见的但是不是特别注意的回调方法. 1.1,ajax $.ajax({ url:"test.json", type: "GET", data: {usern ...

  3. 关于js中的回调函数callback

    来源于:http://www.jianshu.com/p/6bc353e5f7a3 前言 其实我一直很困惑关于js 中的callback,困惑的原因是,学习中这块看的资料少,但是平时又经常见,偶尔复制 ...

  4. 关于 js 中的回调函数 callback

    本文写于1年前 曾经的学习文章如今拿出来分享 前言 其实我一直很困惑关于js中的callback,困惑的原因是,学习中这块看的资料少,但是平时又经常见,偶尔复制一下前人代码,功能实现了也就不再去追其原 ...

  5. 关于js中的回调函数callback,通俗易懂

    前言 其实我一直很困惑关于js 中的callback,困惑的原因是,学习中这块看的资料少,但是平时又经常见,偶尔复制一下前人代码,功能实现了也就不再去追其原由,这么着,这个callback的概念就越来 ...

  6. js中的回调函数 和promise解决异步操作中的回调地狱问题。

    回调函数 : 函数作为参数传递到另外一个函数中.简单数据类型和引入数据类型中的数组和对象作为参数传递大家肯定都不陌生,其实引用数据类型中的函数也是可以的. 事实上大家见到的很多,用到的也很多,比如jQ ...

  7. js中的回调函数

    1.你定义的 2.你没有调用 3.但是最终他执行了 例子: 定时器回调函数 setTimeout(function(){ },100); dom元素的回调函数 document.getElementB ...

  8. PHP中的回调函数和匿名函数

    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...

  9. 理解javascript中的回调函数(callback)【转】

    在JavaScrip中,function是内置的类对象,也就是说它是一种类型的对象,可以和其它String.Array.Number.Object类的对象一样用于内置对象的管理.因为function实 ...

随机推荐

  1. SolidEdge如何绘制阵列之后取消掉某一些

    在最后一步点击"抑制事件",然后可以在被阵列的圆形上单击,被抑制的圆形变成灰色                    

  2. linux操作系统下查看某rpm包是32bit 还是x64bit的命令

    [root@hosta ~]# rpm -qa --queryformat "%{NAME}-%{VERSION}-%{RELEASE} (%{ARCH})\n" | grep l ...

  3. HDU 4791 Alice's Print Service 水二分

    点击打开链接 Alice's Print Service Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K ( ...

  4. c程序设计语言第一章4

    (昨天网络出现了问题,导致这篇没来得及上传,再次补上,今晚照常上传笔记) 练习1.19编写函数r e v e r s e ( s )将字符串s中的字符顺序颠倒过来.使用该函数编写一个程序,每次颠倒一个 ...

  5. 传奇的诞生,PHP三位创始人简介

    PHP到现在为止已经诞生12年了.在这期间它经过不断改善,已经成为Web开发最重要的语言之一.PHP能有今天这样的成就,它的3位创始人(Rasmus Lerdorf.Zeev Suraski和Andi ...

  6. 手动编译一个c文件(Win7下如何使用GCC编译器)

    主要参考这篇http://jingyan.baidu.com/article/c275f6bacc0126e33c756771.html 我没找到minGW的下载地址,而是直接用codeblocks自 ...

  7. 获取连接状态数的awk数组命令

    awk -n|more zhutianpeng@ztp-OptiPlex-:~/Icpp/server$ netstat -n|more 激活Internet连接 (w/o 服务器) Proto Re ...

  8. Tomcat配置,Myeclipse破解和各种设置

    转自:http://www.cnblogs.com/tyjsjl/archive/2006/11/14/2156111.html 根据tomcat来配置eclipse和MyEclipse结合使用起来, ...

  9. poj3349(hash or violence)

    Snowflake Snow Snowflakes Time Limit: 4000MS   Memory Limit: 65536K Total Submissions: 38600   Accep ...

  10. 使用TASM编译COFF格式和连接

    看到网络上流传的一份Drocon的mercury的代码程序源码使用TASM32编译使用MASM32来连接...关键的地方就在这里为什么要使用TASM编译...正常情况下TASM连接出来的程序代码体积远 ...