[js一点也不难]到底什么是回调函数

回调函数是什么

“我先回家,到了给你发短信。”

如果“我先回家”是函数goHome,那么“到了给你发短信”,这个发短信就是回调函数sendMsg。
我必须先回到家以后,也就是函数goHome的内容执行完了,再执行函数sendMsg。

函数sendMsg是以参数形式传给函数goHome的,那么函数sendMsg就叫回调函数。

肯定有人有疑问:一定要以参数形式传过去吗,我不可以直接在函数goHome里面调用函数sendMsg吗?当然可以。但是如果你直接在函数goHome调用的话,那么这个回调函数就被限制死了。使用函数做参数就有这样的好处:当你goHome(sendMsg)的时候函数sendMsg就成了回调函数,而你还可以goHome(call)这个时候,函数call就成了回调函数。如果你写成了

function goHome(){
  // do something 
  sendMsg()
}

就失去了变量的灵活性。

JUST DO CODING(放码过来)

// 回家 
function goHome(callback) {
    // 现在在回家的过程,可以做一系列的事情
    var phone = '玩手机'
    var sleep = '睡觉'
    
    // 最后回调函数
    callback(phone + sleep + '发短信');
} 

function sendMsg(msg) {
    console.log(msg)
} 

goHome(sendMsg)
//输出: 玩手机睡觉发短信

这边可以延伸几个概念

1、函数也是一个类型

[js一点也不难]到底什么是回调函数_第1张图片
查看sendMsg的类型

函数既然是一种类型,也就是说,函数也可以作为参数被传递。
上面的代码,整个思路走一遍就是

// 回家 
function goHome(sendMsg) {
    // 现在在回家的过程,可以做一系列的事情
    var phone = '玩手机'
    var sleep = '睡觉'
    
    // 最后回调函数
    sendMsg(phone + sleep + '发短信');
}

2、这里的回调函数可以直接写成匿名函数

goHome(function (msg) {
     console.log(msg)
})

为什么要用匿名函数?

  • 取名字太痛苦了
  • 《Javascript的一种模块模式》中的第一句话就是“全局变量是魔鬼”。 匿名函数可以有效的保证在页面上写入Javascript,而不会造成全局变量的污染。
  • 给一个不是很熟悉的页面增加Javascript时非常有效,也很优美。

最后说两句

就是这么简单
荆轲刺秦王

有疑问或者建议都可以和我交流哦

你可能感兴趣的:([js一点也不难]到底什么是回调函数)