ajax请求

1 XMLHttpRequest

onreadystatechange 是一个事件句柄。它的值 (state_Change) 是一个函数的名称，当 XMLHttpRequest 对象的状态发生改变时，会触发此函数。状态从 0 (uninitialized) 到 4 (complete) 进行变化。仅在状态为 4 时，我们才执行代码。

 

xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');

如果 requestedWith 为 null，则为同步请求。如果 requestedWith 为 XMLHttpRequest 则为 Ajax 请求。

var data = {};
var xhr = new XMLHttpRequest();
xhr.open('post', 'api/user', true); // 第三个参数中使用了 "true"。该参数规定请求是否异步处理
xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function () {
   if (xhr.readyState === 4 && xhr.status === 200) { // 4 loaded  
     var result = JSON.parse(xhr.responseText);
   }
}
if (token) {
    xhr.setRequestHeader('Authorization', token);
}
xhr.send(JSON.stringify(data));

 

2 JQuery.ajax()

1 某个构造函数内的函数     ajax中的回调函数（success等）直接用this不灵，解决办法是使用bind(this)绑定this到当前事件。

2 全局函数   就可以调用成功

this.lockFile = function () {
    $.ajax({
      method: "POST",
      url: this.options.lockUrl,
      data: JSON.stringify({
        id: this.options.id,
        modCode: this.options.moduleCode,
      }),
      success: function (result) {
        // 这里就可以使用this了
        this.xx();

      }.bind(this)// ajax中的回调函数（success等）直接用this不灵，解决办法是使用bind(this)绑定this到当前事件。
    });
  }

 

3 模仿jQuery封装同时兼容JSONP与Ajax

https://blog.csdn.net/hui_style/article/details/100189211