jQuery-1.5 之后的 ajax

$.ajax这个函数各位应该都比较熟悉了，要完整的讲解 js 的异步操作，就必须先从$.ajax这个方法说起。

想要学到全面的知识，大家就不要着急，跟随我的节奏来，并且相信我。我安排的内容，肯定都是有用的，对主题无用的东西，我不会拿来占用大家的时间。

本节内容概述

• 传统的$.ajax
• 1.5 版本之后的$.ajax
• 改进之后的好处
• 和后来的Promise的关系
• 如何实现的？

传统的$.ajax

先来一段最常见的$.ajax的代码，当然是使用万恶的callback方式

var ajax = $.ajax({
    url: 'data.json',
    success: function () {
        console.log('success')
    },
    error: function () {
        console.log('error')
    }
})

console.log(ajax) // 返回一个 XHR 对象

至于这么做会产生什么样子的诟病，我想大家应该都很明白了。不明白的自己私下去查，但是你也可以继续往下看，你只需要记住这样做很不好就是了，要不然 jquery 也不会再后面进行改进

1.5 版本之后的$.ajax

但是从v1.5开始，以上代码就可以这样写了：可以链式的执行done或者fail方法

var ajax = $.ajax('data.json')
ajax.done(function () {
        console.log('success 1')
    })
    .fail(function () {
        console.log('error')
    })
    .done(function () {
         console.log('success 2')
    })

console.log(ajax) // 返回一个 deferred 对象

大家注意看以上两段代码中都有一个console.log(ajax)，但是返回值是完全不一样的。

• v1.5之前，返回的是一个XHR对象，这个对象不可能有done或者fail的方法的
• v1.5开始，返回一个deferred对象，这个对象就带有done和fail的方法，并且是等着请求返回之后再去调用

改进之后的好处

这是一个标志性的改造，不管这个概念是谁最先提出的，它在 jquery 中首先大量使用并让全球开发者都知道原来 ajax 请求还可以这样写。这为以后的Promise标准制定提供了很大意义的参考，你可以以为这就是后面Promise的原型。

记住一句话————虽然 JS 是异步执行的语言，但是人的思维是同步的————因此，开发者总是在寻求如何使用逻辑上看似同步的代码来完成 JS 的异步请求。而 jquery 的这一次更新，让开发者在一定程度上得到了这样的好处。

之前无论是什么操作，我都需要一股脑写到callback中，现在不用了。现在成功了就写到done中，失败了就写到fail中，如果成功了有多个步骤的操作，那我就写很多个done，然后链式连接起来就 OK 了。

和后来的Promise的关系

以上的这段代码，我们还可以这样写。即不用done和fail函数，而是用then函数。then函数的第一个参数是成功之后执行的函数（即之前的done），第二个参数是失败之后执行的函数（即之前的fail）。而且then函数还可以链式连接。

var ajax = $.ajax('data.json')
ajax.then(function () {
        console.log('success 1')
    }, function () {
        console.log('error 1')
    })
    .then(function () {
        console.log('success 2')
    }, function () {
        console.log('error 2')
    })

如果你对现在 ES6 的Promise有了解，应该能看出其中的相似之处。不了解也没关系，你只需要知道它已经和Promise比较接近了。后面马上会去讲Promise

如何实现的？

明眼人都知道，jquery 不可能改变异步操作需要callback的本质，它只不过是自己定义了一些特殊的 API，并对异步操作的callback进行了封装而已。

那么 jquery 是如何实现这一步的呢？请听下回分解！