详解回调函数

前言回调函数作为我们经常用到的一种函数,看似复杂,实则很容易理解,下面让我来带你一步步理解回调函数 。
详解我们先来看一个我们最熟悉的普通函数的定义与调用 。
function map (c) {console.log(c);}map(5);

详解回调函数

文章插图
 
这是我们最常见的函数,而这种函数定义时就是规定了方法,而需要传入变量 。
那我们换一种思维,我们规定好函数的变量,而传入方法呢,我们这里设置方法b为我们的形参
var map = function (b) {b(4);}这时我们发现,我们在调用函数map的时候需要传入一个方法进去,那我们就按照定义传入一个方法 。
map( function(a) {console.log(a);} );此时我们并没有给这个传入的方法起名字,这个方法又称之为匿名函数,所以我们这里调用map方法时可以简写为
map((a) => {console.log(a);});
详解回调函数

文章插图
 
打印4,而我们红框里的内容就是我们传入的参数,这不过这个参数是一个函数罢了 。也就是说,红框里的内容与上面的形参b相等,我们用红框里的函数去替换b,就得到了 console.log(4)。
二次回调函数我们再来看一个二次回调的例子
刚才我们在函数定义时规定了变量是一个常数,而如果我们将这个常数换为一个匿名函数呢
var map = function (b){b( (a)=>{console.log(a);} );};我们看到,刚才的4换为了一个函数,我们如何去调用方法map呢?
我们可以逆向思维想象一下,我们调用函数map时需要传入一个参数,参数替代b,而我们此时b里已经有了方法,而缺少变量,这就相当于我们上面讲一次回调函数时的调用函数部分,此时我们传入一个定义了变量而参数是个方法的方法进去,就相当于一次回调函数的函数定义部分 。
map( function (e) {e(6);} );简写为 map( (e) => {e(6);} );。
详解回调函数

文章插图
 
【详解回调函数】此时我们红框里的内容依旧相当于上面的形参b,而替换掉b以后,我们蓝框里的内容就相当于下面的形参e,再替换掉e以后,就只剩下了我们最终想要表达的打印方法 console.log(6);。
总结根据二次回调函数的思想,我们可以无限回调 。但我们对多次回调函数很少用到 。
我们对于基础知识应该牢牢把握才能理解整篇代码 。




    推荐阅读