[JS] 关于回调函数(callback)
mr小卓X • 2020 年 04 月 17 日
相信接触过 JavaScript 的朋友都知道一个操作:“回调函数”,这个操作在JS中用的非常非常多。
关于回调函数
如何简单的理解回调函数呢?这边做一个简单的例子。
你到商店买一双你最喜欢的球鞋,但是今天这双鞋已经卖完了,需要等一段时间后才能买到。为了方便下一次成功取得球鞋,你需要将一个方法告诉店员,方便他在新鞋到的第一时间通知你。比如说告诉他:球鞋到后你可以通过电话号码:XXXXX 打电话告知我有库存了,我可以来买了。
这里告诉店员到货后的操作就是回调,我们用代码实现一下上面的时事件:var 库存 = 0;
function 球鞋进货(回调){
库存 += 100;
回调();
}
球鞋进货(function(){
打电话给我('123456789');
});
以上操作为:当球鞋库存添加后,回调将被执行。
回调解决的问题
在大部分编程语言中,以上的操作也可以:库存 = 0;
def 球鞋进货():
return 库存 + 100;
库存 = 球鞋进货()
打电话给我('123456789')
这种方法在 Python 中是完全没有任何问题的!但是 JS 在一些场所中是无法使用的!
事件的监听
最简单的JavaScript 的朋友都知道一个操作:“回调函数”,这个操作在JS中用的非常非常多。
关于回调函数
如何简单的理解回调函数呢?这边做一个简单的例子。
你到商店买一双你最喜欢的球鞋,但是今天这双鞋已经卖完了,需要等一段时间后才能买到。为了方便下一次成功取得球鞋,你需要将一个方法告诉店员,方便他在新鞋到的第一时间通知你。比如说告诉他:球鞋到后你可以通过电话号码:XXXXX 打电话告知我有库存了,我可以来买了。
这里告诉店员到货后的操作就是回调,我们用代码实现一下上面的时事件:var 库存 = 0;
function 球鞋进货(回调){
库存 += 100;
回调();
}
球鞋进货(function(){
打电话给我('123456789');
});
以上操作为:当球鞋库存添加后,回调将被执行。
回调解决的问题
在大部分编程语言中,以上的操作也可以:库存 = 0;
def 球鞋进货():
return 库存 + 100;
库存 = 球鞋进货()
打电话给我('123456789')
这种方法在 Python 中是完全没有任何问题的!但是 JS 在一些场所中是无法使用的!
事件的监听
最简单的按钮点击事件:document.getElementById('#button').addEventListener(function(){
alert("按钮被点击啦!!");
});
这种时候我们无法使用上面的方法,因为我们并不知道这个按下事件什么时候会发生。
就像上面的“球鞋进货”,我们并不知道球鞋什么时候会进货,他并不是马上就能发生的事情。
异步操作
异步这东西是常常把我折磨的死去活来,就好比说:
小明在家,准备做饭:
同步:先煮饭,等待饭好后再炒菜。
异步:煮饭开始后就直接去炒菜。
回调在异步中的用处就是告知小明饭已经煮好了,可以做后续操作了。如果没回调,饭好后就不会有响应了。