jQuery 发送一个 ajax 请求

jQuery里面帮我们封装好了几个方法，专门用来发送 ajax 请求的。

  1. $.get() :专门用来发送 get 请求的
  2. $.post() :专门用来发送 post 请求的
  3. $.ajax() :发送什么请求都可以(get, post, put, delete)，并且还可以发送一个 jsonp 请求

jQuery 发送一个 GET 请求

语法: $.get(请求地址, 需要携带到后端的参数, 成功的回调函数, 期望后端返回的数据类型)

请求地址: 你要请求的后端接口地址(必填)

携带参数: 你需要给后端传递的参数

可以是一个固定格式的字符串 'key=value&key=value'，也可以是一个对象 { a: 100, b: 200 }

成功回调: 当请求成功的时候会执行的函数

期望数据类型: 就是你是不是需要 jQuery 帮你解析响应体，默认是不解析，当你传递一个 ‘json’ 的时候, 会自动帮你执行 JSON.parse()

jQuery 发送一个 POST 请求

语法: $.post(请求地址, 需要携带到后端的参数, 成功的回调函数, 期望后端返回的数据类型)

四个参数和 $.get 是一模一样的。

jQuery 的 $.ajax 方法

用来发送综合 ajax 请求的(GET, POST, PUT, …)

语法: $.ajax(对象)

对象是对本次请求的所有配置。

$.ajax({
        url: '', // => 请求地址(必填)
        type: '', // => 请求方式(GET, POST, ...) 默认是 GET
        data: '', // => 携带到后端的参数
        dataType: '', // => 期望后端返回的数据类型, 默认不解析
        async: true, // => 是否异步, 默认是 true
        success: function () {}, // => 成功的回调
        error: function () {}, // => 失败的回调
        timeout: 数字, // 单位是 ms, 超时时间(超过你写的时间没有响应, 那么就算失败)
        cache: true, // 是否缓存, 默认是 true
        context: 上下文, // 改变回调函数里面的 this 指向
        ...
      })

$.ajax 里面失败的回调

不光是请求失败的时候会触发，jQuery 认定失败就是失败，当 dataType 写成 json 的时候, jQuery 会帮我们执行 JSON.parse()；当后端返回一个不是 json 格式的字符串的时候，执行 JSON.parse() 就会报错，也会执行失败的回调, 请求虽然成功, 但是解析失败了, 也是失败；JSON.parse('你好 世界') ，就会报错了。

$.ajax 里面的回调 this 指向问题

ajax 的回调里面默认 this 指向被 jQuery 加工过的 ajax 对象;
context 的值你写的是谁, 回调函数里面的 this 就是谁。

$.ajax 里面的请求方式的问题

$.ajax 这个方法里面, type 表示请求方式;
jQuery 还给了我们一个参数叫做 method，也表示请求方式，当你写请求方式的时候，可以写成 type: 'POST'，也可以写成 method: 'POST'。

$.ajax 里面的接收响应的问题

(2015年以后的版本才有 promise 的形式)
jQuery 默认把 ajax 封装成了 promsie 的形式，你可以用 success 选项接收成功的回调，也可以用 .then() 的方式接收响应。