手写AJAX(async Js and XML))

手写AJAX

• 1.创建一个对象; var xhr = new XMLHttpRequest()
• 2.设置方法和路径：发请求要发到那个地方？(方法，路径，异步（默认不写）) xhr.open('GET','/xxx')
• 3.发送消息体：设置请求体，get请求体一般是空的传了也是白传，不会发送，post一般是传一个json数据； xhr.send('{"name":"frank"}')
• 4.监听onreadystatechange事件，发送后，成功或者失败要有一个回调,成功后，失败后会怎样？

xhr.onload = () =>{
console.log('得到内容')
}
xhr.onerror = () =>{
}

• 总结，一般是先看成功或失败后再send，所以send一般写在后面；

 var xhr = new XMLHttpRequest()
 xhr.open('GET','/xxx')
 xhr.onload = () =>{
console.log('得到内容')
}
xhr.onerror = () =>{
}

xhr.send('{"name":"frank"}

Axios是什么？

Axios 是一个基于 promise 的 HTTP 库，简单的讲就是可以发送get、post请求。说到get、post，大家应该第一时间想到的就是Jquery吧，毕竟前几年Jquery比较火的时候，大家都在用他。但是由于Vue、React等框架的出现，Jquery也不是那么吃香了。也正是Vue、React等框架的出现，促使了Axios轻量级库的出现，因为Vue等，不需要操作Dom，所以不需要引入Jquery.js了。 意思就是用JavaScript执行异步网络请求。

Axios特性

1、可以在浏览器中发送 XMLHttpRequests
2、可以在 node.js 发送 http 请求
3、支持 Promise API
4、拦截请求和响应
5、转换请求数据和响应数据
6、能够取消请求
7、自动转换 JSON 数据
8、客户端支持保护安全免受 XSRF 攻击

写AJAX

记忆题，写博客吧

const ajax = (method, url, data, success, fail) => {
var request = new XMLHttpRequest()
request.open(method, url);
request.onreadystatechange = function () { if(request.readyState === 4) {
if(request.status >= 200 && request.status < 300 || request.status === 304) { 
success(request) }else{ fail(request) 
  }
 }
};
request.send();
}