谈谈Js回调函数的那些事儿

最新推荐文章于 2022-10-17 15:33:29 发布

原创最新推荐文章于 2022-10-17 15:33:29 发布 · 441 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js #回调 #回调函数 #闭包 #js特性

前端开发专栏收录该内容

12 篇文章

订阅专栏

本文深入浅出地介绍了JavaScript中的回调函数概念，通过实例演示了如何使用匿名及显式函数进行回调，并展示了如何利用回调实现闭包功能。

今天，来谈谈Js函数的一大特点——回调函数。

什么是回调函数？

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

翻译过来也就是

回调就是将一个函数（a）作为另一个函数（b）的参数,当b执行结束后再执行a的过程。

这话说的是相当拗口啊！其实啊，别看这段话特别的绕，但实践到代码上却是简单明了，下面直接上例子：

var fn = function(callback){
	alert('fn');	
	if(typeof(callback) == 'function'){
		callback();
	}
}

这里的callback就是定义中的a函数，fn就是定义中的b函数，这样看来是不是一目了然了呢！

通常callback的实现有两种方式：匿名函数调用、显式函数调用

先看匿名函数调用：

		fn(function(){
			alert('callback'); //==>fn==>callback
		});

再看显式函数调用：

                var callbackFn = function(){
			alert('callbackFn');
		}
		fn(callbackFn);//==>fn==>callbackFn

看到这里，你也许会发出“这回调函数也太弱了吧，就这点能耐！”这里，我只能表示“同学，你还是图样图森破！”

下面，我将展示一个利用回调实现闭包的功能，听起来是不是特别高大上？！

首先，我们来回忆一下闭包的实现方式：

		var closure = function(){
			var privateVar = 0;
			return function(){
				privateVar++;
				return privateVar;
			}
		}
		var fn = closure();
		alert(fn());==>1
		alert(fn());==>2

闭包的详细内容请参阅我的博文《谈谈Js闭包的那些事儿》

那通过回调怎样来实现闭包的功能呢？

		var fn = function(callback){
			var fnvar = {
				name : 'fn',
				value : 'test1'
			};
			if(typeof(callback) == 'function'){
				callback(fnvar);
			}
		}
		var callbackFn = function(fn){
			alert(fn.name + ':' + fn.value);//==>fn:test1
		}
		fn(callbackFn);

这样实现的闭包功能是不是更简单易懂呢，实话说，用这种方法来异步操纵数据还是蛮好有的。

完结！