AJAX 中的异步

XHR 对象的 open 方法的第三个参数，不写的时候，默认为 true，也就是异步执行。

xhr.open('get', 'data.json');

这时候，在监听 readyState 变化里面才能够保证数据已经获取成功。

let data = null;
xhr.open('get', 'data.json');
xhr.onreadystatechange(function() {
  console.log(readyState); //=> 这里会输出三次，2,3,4，只要这个码变化才会被监听到
  if (xhr.readyState == 4 && /^2\d{2}$/.test(xhr.status)) {
    data = JSON.parse(xhr.responeText);
  }
})
console.log(data); //=> null;

一般情况下，我们把获取到数据后要执行的事情，封装在一个回调函数里面，然后再 AJAX 异步获取到数据之后，执行这个回调函数。

xhr.onreadystatechange(function() {
  console.log(readyState); //=> 这里会输出三次，2,3,4，只要这个码变化才会被监听到
  if (xhr.readyState == 4 && /^2\d{2}$/.test(xhr.status)) {
    data = JSON.parse(xhr.responeText);
    cb(data);
  }
})
function cb(data) {
}