深入 JavaScript 异步编程-03Ajax异步封装原创

那整个的异步的执行结束之后啊，那其实呢，我们也通过啊，这个就现在啊，其实呢，大家也都能够听得清楚啊，那么接着呢，我们还是啊通过一个流程图呢，再给大家去做一个简单的小展示啊，所谓的这个流程图啊，实际上就是我们刚刚所执行的一个比较平面化的一个啊图，这个视图里边呢，我们也能看到，就是一个张视的线程开始去执行，那么执行的过程中一旦有了异步代码，那么就会发起异步调用，当异步调用你的代码啊，就是调用我们的啊异步调用线程啊，那么这个线程开始去执行它的异步任务，和我的主线程是没关系的，也就是你可以两个一起做啊，当然这个呢，是我们不在我们当前的这个代码的主线程上，那么注意什，你说哎，我执行完了是吧，结束的比较早是吧？啊没关系，我不管你什么时候结束，你都会干嘛呢。

先把你执行之后1亿步执行的这个内容啊，先去跑到我的学习队列里面啊，那在学习队列里面，我学习队列里面的执行内容啥时候去执行呢？诶等我整个的本轮的这个交融站里面其他的任务都没有了，代码都执行结束了，那么我会通过什么loop的方式来去看，诶说消息队列里面有没有数据啊，或者有没有内容啊，有的话那我开始去执行啊，那么再一轮一轮去这样跑，OK，那么这就是我们整轮的这个流程啊好了，那问题在于什么呢？注意啊，我们能看到整个代码的执行过程中，杰斯本身啊，杰斯本身这个线程啊，它依然是单形程的，对吧？那异不执行呢？最终的结果啊，依然是需要回到我们的GS线程上来的啊，那所以啊，在GS中，异步的结果回到主线程的这种方式采用的注意叫做回调函数，那这里呢，我们也写了一个回调，那所谓的回调。

函数啊，就是在我们的GS主线程上去声明一个函数啊，然后将函数作为参数传入异步调用的线程，那当异步执行结束后，调用这个函数，将结果呢，又以实参的形式来传入到我们的什么这个函数的电容当中啊，当然也有可能不传参啊，OK，那前面代码中呢，我们的set out实际上就是一个异步的方法，传入的第一个参数实际上就是回调函数，那这个函数的执行呢，就是消息队列中的回调了，那么现在呢，我们也能看到这里啊，就标出来了，就是回调一，回调二，OK，那么再下来我要做一件事情啊，做什么呢？就是我这个所谓的回调函数应该怎么去写呢？啊，能不能自已去写一个这样的回调来去处理我们的异步的结果，或者异步的数据呢，请注意啊，刚才呢，我们一直在提啊，这个叫什么。

啊，回调回调啊，这个回调所谓的到底是啥意思，你要明白一件事情，就是我们刚刚所说的这个javascript的线程，你的处理代码的时候，你的回调就是你的这个代码的执行，异步的代码的执行一定是回到你的主线程上执行了啊，但是有一个最终的问题就在于你异步的结果怎么回来呢？它是不同的线程啊啊所以这个时候呢，我们一般啊都是把结果通过什么函数参数的方式来去使用回调函数啊来调用的方式来去拿到在主线程中拿到异步之行的结果啊，那这个到底是怎么去做啊，啊其实呢也很简单，我呢也准备了一个代码给大家呢，去看一下，打开我的代码啊，代码里呢，非常的简单啊，这个简单的地方在哪呢？哎，就是一个贴面对吧，大家能看清楚啊，然后呢，呃，写了一个什么八天按钮的话，一点击呢，就四的调用啊，现在在哪呢？哎，在里我引入了一。

那么叫in.JS那这个ind JS里面写了什么代码呢？注意这里面就实现了一个什么，哎，就是我们刚刚看到的这个代码，OK，能看到吧，啊这个代码呢，就是我们刚刚去写了，那这个呢，我们就不再去展示了，然后展示什么呢？展示啊，我用这个阿贾克斯的方式来通过异步获取阿里克斯回调的数据的方式来给大家呢做展示，好那么接着我们去这样啊，然后呢，我去切换到我的那个呃，回调函数的人啊，一个call back OK，回来好，回来之后呢，我做了这样的一件事情，这个代码呢，其实没怎么去变啊，就是我依然去写了一个代码啊，那在这个代码当中啊，在这个代码当中呢，我去啊设置一个点击按钮，一点击呢，我就开始去发送这个三的请求，那这个请求里面你会发现一个问题啊，发现一个事情啊，发现什么事情呢？我这个代码写的呀，注意啊，我就告诉你啊，是一个阿里克斯的请求，这个阿迪克斯请求。

干了件什么事情呢？向我的8001这个端口啊，发送一个ACB请求，那回来的数据和结果呢，我就这里直接通过这个函数实行参的方式拿到，然后呢，这里直接干嘛conso log打印出来啊，代码呢，用起来非常简单对吧？但问题在于你这个马艾克斯是哪来的呢？啊，咱就简单了，实际上就是我在in黛里啊去做了一个简单的封装啊，那么我们打开这个in.JS里啊，我们来看一下我到底是怎么做的这个封装，注意这才是写回调函数的关键内容啊，或者叫关键点啊OK，我们来看一下，首先呢，我封装了一个叫马阿列克斯这样的一个函数，这个函数呢，接收的是两个参数，两个参数第一个呢就是URL，就是你请求的是哪一个地址，那第二个呢，是回调函数A，注意这就是回调函数了，那到底怎么用啊，一会我们来看啊。

好，首先呢，我去new这个啊，XL at request对吧？然后呢，Change啊，然后这里等于四的时候啊，等于状态等于200的时候，那我就回掉了，这后面呢也是一样，你把这个呢先收起来啊，你先不用看这些判断啊，那再往下呢，就是哎奥词趁着完了之后呢，就open是吧，发送get球，然后send开始发送，那么数据回来之后，哎，请注意啊，我怎么回到你的主线程上呢？哎，这就是最关键点了，先去判断你是不是正确的回啊，拿回来了值对吧？一旦拿回来了值请注意，关键的点就在这个判断一个什吧叫做call back了，你要明白一件事情，Call back做了什么呢？注意啊，Call back就是一个函数，这个函数在哪，在你前面调用马阿杰克斯的时候传进来的，而且你传递的这个第二个参数，也就是你前面我不管谁啊，你爱调就咋调，反正你第二个参数一定要给我传一个函数进来，这个函数的速。

作用就是当异步执行，看这里判断对吧，成功了啊，等于四了状态码啊，然后呢，服务器给我返回状态码也是200啊，啊都没有问题了，好了，我去干嘛呢？我去调用你前面给我传过来了这个Co函数，那调用它做什么呢？我就把谁呀阿贾克斯返回来的response test或者response time ML等等这些数据通过调用call back这个函数的方式传回去啊传回去那这里面写了两两个参数啊，就是我不管是成功还是失败啊，我都调用啊，都调用这个call back，那如果是成功呢，第一个参数呢，就写一个now就可以了，那第二个参数就写我阿贾克斯请求返回来的这个数据。OK，那么再往下啊，就是失败的时候呢，我就把什么失败的信息给它传回去，那第二个参数呢，那就行当，那么也就意味着你前面在使用这个函数的时候，第一个参数就是失败的情况啊，第二个参数就是给你返回来的值，那如果你用过NOTE7S去读写文件啊，那你可能就非常的熟悉啊，熟悉什么呢？比如我们可能这么用啊，就是F点啊，这个什么叫read file啊，Read file，然后括号里面对吧？啊这么调用的，我当时写的不对啊，这个没关系啊，就是你是啊，比方说aa.t对吧，那第二个参数你就写一个什么啊，Function呢，对吧，Function里面你写一个ER或者是date对吧，就这么写的啊，一般啊就是说我们的回调函数里面，如果你要去判断错误情况，那么第一个参数一般都是错误的啊，第二个参数一般都是接受什么正确的结果，所以这里呢，我也封装成了类似的这种情况。

啊，类似的这种情况，OK，那么这是我们封装啊一个阿贾克斯，那此时使用的就是是样，我们使用这个回调函数的方式来去拿到异步返回给我们的这个结果啊，OK，那么这个能不能听清楚啊，能听清楚的话可以回个一好吧，来啊，可以吗？啊，我们还没试呢是吧，我们也可以去试一试啊来啊试一试怎么试呢？这样我的服务器还没开啊，我把服务器先开了是吧？嗯，好，我就把这个服务器放在一边啊，然后呢，我去开一下我的这个服务器，好去执行一下，OK啊8001啊，先给大家去在浏览器里看一眼，这个8001啊801。

这是我本地的开启了这样的一个服务器啊，那服务器呢，就是呃，和我的这个前面写的这个封装啊一起来去连连调连调使用的啊，然后返回的数据呢，就是老师祝你早日富可敌国好吧，啊开个玩笑啊好了，那么有了它之后啊，那我们就回到这个in.ATM这里来，我们通过打开浏览器的这个方式啊来，那么拷到这里啊，这是send server，然后呢，我们找到检查这里，我应该是直接consol log了是吧，所以呢，我就点一下诶看里对吧？啊一点进呢，这个数据也就回来了，好，那么这就是通过阿贾克斯封装的方式，我们来去看一下这个所谓的异步的回调函数处理结果的方式到底是怎么样的，OK，哎呦，我天，你吓我吓我一跳，我还没没完事呢，这。