资讯专栏INFORMATION COLUMN

彻底理解JavaScript中回调函数 (推荐)

RayKr / 1965人阅读

摘要:在中回调函数非常重要,它们几乎无处不在。首先你得先明白一点函数也是对象想弄明白回调函数,首先的清楚地明白函数的规则。理解了函数也是对象,先不急聊回调函数,先看看下面代码只写变量名返回的将会是方法本身,以字符串的形式表现出来。

在javascript中回调函数非常重要,它们几乎无处不在。像其他更加传统的编程语言都有回调函数概念,但是非常奇怪的是,完完整整谈论回调函数的在线教程比较少,倒是有一堆关于call()和apply()函数的,或者有一些简短的关于callback的使用示例。
首先你得先明白一点:

函数也是对象

 想弄明白回调函数,首先的清楚地明白函数的规则。先来看个例子:

//可以这样创建函数
var fn = new Function("arg1", "arg2", "return arg1 * arg2;");
fn(2, 3);   //6

 这样做的一个好处,可以传递代码给其他函数,也可以传递正则变量或者对象(因为代码字面上只是对象而已)。
在javascript中,函数是比较奇怪的,但它确确实实是对象。确切地说,函数是用Function()构造函数创建的Function对象。Function对象包含一个字符串,字符串包含函数的javascript代码。

理解了函数也是对象,先不急聊回调函数,先看看下面代码:

function say (value) {
    alert(value);
}
alert(say);
alert(say("hi js."));

只写变量名 say 返回的将会是 say方法本身,以字符串的形式表现出来。
而在变量名后加()如say()返回的就会使say方法调用后的结果,这里是弹出value的值。

js中函数可以作为参数传递

再看下面两段代码:

function say (value) {
    alert(value);
}
function execute (someFunction, value) {
    someFunction(value);
}
execute(say, "hi js.");

function execute (someFunction, value) {
    someFunction(value);
}
execute(function(value){alert(value);}, "hi js.");

上面第一段代码是将say方法作为参数传递给execute方法
第二段代码则是直接将匿名函数作为参数传递给execute方法

实际上:

function say (value) {
    alert(value);
}
// 注意看下面,直接写say方法的方法名与下面的匿名函数可以认为是一个东西
// 这样再看上面两段代码是不是对函数可以作为参数传递就更加清晰了
say;

function (value) {
    alert(value);
}

这里的say或者匿名函数就被称为回调函数!

如果还不懂,看看下面并不是很完美的比喻:
你到一个商店买东西,刚好你要的东西没有货,于是你在店员那里留下了你的电话,过了几天店里有货了,店员就打了你的电话,然后你接到电话后就到店里去取了货。在这个例子里,你的电话号码就叫回调函数,你把电话留给店员就叫登记回调函数,店里后来有货了叫做触发了回调关联的事件,店员给你打电话叫做调用回调函数,你到店里去取货叫做响应回调事件。

回调函数容易混淆点——传参

两种回调函数传参的方法:

将回调函数的参数作为与回调函数同等级的参数进行传递

回调函数的参数在调用回调函数内部创建

希望我对回调函数的一点点小总结能对大家有帮助,
关于回调函数还有什么问题可以在下面留言,一起交流。

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

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

相关文章

  • javascript 回调函数 整理

    摘要:回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应。若是使用回调函数进行处理,代码就可以继续进行其他任务,而无需空等。参考理解回调函数理解与使用中的回调函数这篇相当不错回调函数 为什么写回调函数 对于javascript中回调函数 一直处于理解,但是应用不好的阶段,总是在别人家的代码中看到很巧妙的回调,那时候会有wow c...

    xiaowugui666 评论0 收藏0
  • ES6-7

    摘要:的翻译文档由的维护很多人说,阮老师已经有一本关于的书了入门,觉得看看这本书就足够了。前端的异步解决方案之和异步编程模式在前端开发过程中,显得越来越重要。为了让编程更美好,我们就需要引入来降低异步编程的复杂性。 JavaScript Promise 迷你书(中文版) 超详细介绍promise的gitbook,看完再不会promise...... 本书的目的是以目前还在制定中的ECMASc...

    mudiyouyou 评论0 收藏0
  • JavaScript彻底理解同步、异步和事件循环(Event Loop)

    摘要:例如处理请求的线程处理事件的线程定时器线程读写文件的线程例如在中等等。事件循环事件循环是指主线程重复从消息队列中取消息执行的过程。事件触发时,表示异步任务完成,会将事件监听器函数封装成一条消息放到消息队列中,等待主线程执行。 一. 单线程 我们常说JavaScript是单线程的。 所谓单线程,是指在JS引擎中负责解释和执行JavaScript代码的线程只有一个。不妨叫它主线程。 但是实...

    wenyiweb 评论0 收藏0
  • 深入前端-彻底搞懂JS的运行机制

    摘要:浏览器是多进程的详情看我上篇总结浏览器执行机制的文章深入前端彻底搞懂浏览器运行机制浏览器每打开一个标签页,就相当于创建了一个独立的浏览器进程。执行异步操作事件完成,回调函数进入。主线程从读取回调函数并执行。 最近看了很多关于JS运行机制的文章,每篇都获益匪浅,但各有不同,所以在这里对这几篇文章里说的很精辟的地方做一个总结,参考文章链接见最后。本文博客地址 了解进程和线程 进程是应用...

    luckyw 评论0 收藏0
  • 深入前端-彻底搞懂JS的运行机制

    摘要:浏览器是多进程的详情看我上篇总结浏览器执行机制的文章深入前端彻底搞懂浏览器运行机制浏览器每打开一个标签页,就相当于创建了一个独立的浏览器进程。执行异步操作事件完成,回调函数进入。主线程从读取回调函数并执行。 最近看了很多关于JS运行机制的文章,每篇都获益匪浅,但各有不同,所以在这里对这几篇文章里说的很精辟的地方做一个总结,参考文章链接见最后。本文博客地址 了解进程和线程 进程是应用...

    jaysun 评论0 收藏0

发表评论

0条评论

RayKr

|高级讲师

TA的文章

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