JavaScript中的回调函数

Posted 2020-09-13 郭德纲的锅和缸

　　在学习javascript的过程中遇到了很多，使用到回调函数的例子，出现了许多疑问，就由一个栗子开始吧：

　　在JavaScript中接触的第一个回调函数是在setInterval（）和setTimeout（）中出现的:

 

1   var num = 10;
2 
3   var interValId = setInterval(function (){
4       console.log(num);
5       num--;
6       if(num==0){
7         clearInterval(interValId);
8      }
9  },1000);

 

 

 

 

　　代码中实现了使用了setInterval（）在控制台打印数值，然后当数值变为0的时候停止打印。

　　在使用setInterval（）的时候使用了一个匿名函数作为回调函数，当时看到这，就懵掉了，

此匿名函数没有实参列表，也就是说这是一个函数声明，不是调用，而且这个匿名函数写在setInterval（）的形参列表位置，说明它是setInterval（）的形参，但是这个函数是在什么时候调用的呢，如果这个函数也需要传参呢，在调用这个匿名函数的时候，又是怎样实现参数传递的呢。

 

　　

　　再一次遇见它是在学习DOM2中使用addEventListener（）进行事件绑定的时候：

　　

1 btn2.addEventListener("click",function (){
2     btn1.removeEventListener("click",func1)
3 },false)

　　在取消事件绑定的时候，有个要求，就是removerEventListener（）中的回调函数不能是匿名函数。但是问题还是没有解决，接下来又遇到了有形参列表的回调函数：

　　数组中的排序函数：sort（）；

1         arr3.sort(function(a,b){
2             //return a-b; // b在前，a在后(升序排列)
3             return b-a;  // a在前，b在后(降序排列)
4         });

　　这次的回调函数竟然有了形参，但是问题还是那个问题，这里的形参a，b什么时候变为实参的？他们被赋予实参的时候，赋的值又是什么呢？

　　所有的可能性都被排除了，只有一种就是，sort（）这个函数给回调函数的参数进行赋值，并把回调函数进行了调用，这样就要求，回调函数的函数声明必须按照调用它的函数的规定进行编写，就是调用它的函数需要它完成什么样的功能，回调函数的函数体应该是怎样的，而且它的参数也不能乱写，必须按照规定写形参，他在调用的时候，传了几个实参，就要写几个形参。

　　在使用系统已经写好的函数中编写回调函数的时候，程序员们需要完成的部分，只是回调函数的声明部分，而且参数必须按照规定写。

　　 

　　函数也是对象

　　想弄明白回调函数，首先的清楚地明白函数的规则。在javascript中，函数是比较奇怪的，但它确确实实是对象。确切地说，函数是用function()构造函数创建的function对象。function对象包含一个字符串，字符串包含函数的javascript代码。代码怎么可能是字符串？对于javascript来说，这很平常。数据和代码之间的区别是很模糊的。

　　回调函数就是一个通过函数指针调用的函数。如果你把函数的指针（地址）作为参数传递给另一个函数，当这个指针被用为调用它所指向的函数时，我们就说这是回调函数。回调函数不是由该函数的实现方直接调用，而是在特定的事件或条件发生时由另外的一方调用的，用于对该事件或条件进行响应。

　　因此，回调本质上是一种设计模式，并且jQuery(包括其他框架)的设计原则遵循了这个模式。

　　在JavaScript中，回调函数具体的定义为：函数A作为参数(函数引用)传递到另一个函数B中，并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式)，就叫做匿名回调函数。

　　因此callback 不一定用于异步，一般同步(阻塞)的场景下也经常用到回调，比如要求执行某些操作后执行回调函数。