js回调函数的用途与写法

用途

一般情况下回调函数都用在页面与服务器的异步交互，以解决页面在提交请求后无法获得到服务器反馈的数据，

为什么会出现面在提交请求后无法获得到服务器反馈的数据呢？首先来了解js的事件执行方式，如图

js在执行程序时，所有代码都在执行栈中，此时都是同步在执行，但在运行代码时如果遇见事件绑定、计时器会将抛到异步任务队列里面等待js引擎执行，然后继续执行在执行栈中的代码，于此同时，被抛到异步执行队列里面的计时器会执行等待的时间，如果等待时间结束，则会将此事件抛到执行队列里面。执行栈里面的代码执行完成后，程序会去检查执行队列里面是否有事件，如果有，则拿出来执行。如果没有，则会一直循环检查，直到异步事件队列和执行队列里面都没有才结束程序

代码解释：

上图中，用的是ajax异步请求服务器。红框内部是同步执行的，所以当js引擎在遇见红框外面的onreadystatechange触发事件时会将此事件丢到异步任务队列里面，然后继续向下执行，然后结束第一遍事件循环。

那么此时的问题就出现了，由于第一遍执行完后，onreadystatechange并没有执行。所以此时在调用ajax方法的位置根本无法获取到return的obj对象。

然而用上回调函数后

调用ajax方法：

ajax函数：

此时在调用ajax的页面里面，fn回调函数是与其他代码同步执行的，即使ajax方法里面的onreadystatechange被丢到了异步任务队列，此时ajax方法也必须等onreadystatechange事件执行完成后将值反馈给回调函数fn才能结束ajax方法里面的程序

写法

看上面的照片可以知道，先个ajax定义一个方法参数，然后在这个方法参数里面写只有从服务器反馈的信息才能写的代码。然后到ajax函数里面的特定位置（和服务器交互的一些事件里）给这个方法参数传入一个形参，此形参就是服务器得到得数据。这样就构成了一个回调函数。

回调函数不仅可以用在以上的异步交互案例中，其他的一些情况也可以用，创建思路都是一样的，用来获取某些条件下无法获取到的数据，例如：定时器、触发事件里面都含有回调函数。