在浏览中发生ajax请求有两种方式:
1.XMLHttpRequest对象,原生xhr对象发生请求需要四个步骤:
1.创建xhr对象
2.初始化请求,调用open方法,open方法需要设置两个参数:请求方式和请求地址,如果是get请求方式,并且需要传递参数,参数要拼接在地址后面
3.发送请求,调用send方法,如果是post请求,并且需要传递参数,参数需要放置在send方法中注意:post请求方式在方式请求前,需要设置一个请求头信息,明确请求体的数据格式类型。
4.通过onreadystatechange事件,监听返回的结果
通过上面的描述我们发现xhr发生ajax请求真的好麻烦所以,出现了很多第三方请求库,比如jquery,语法确实会更加简洁,但是它有一个先天缺陷,结果是通过回调函数返回的,这样带来的问题时,如果第二个请求需依赖第一个请求的结果,就必须要写嵌套,嵌套的层次越多,代码越难阅读,不易维护。
2.fetch()方法
后来ES6又推出一个全新的对象,Promise,这是一个用于处理异步编程回调嵌套的对象我们可以利用Promise对象对xhr对象进行封装,当然也出现了很多基于Promise的xhr封装的第三方库,比如:axios。axios的优势是它可以链式调用,解决了回调地狱问题。
由于市面上出现了众多采用Promise对xhr对象的封装库,后来,官方也推出了一个全新的API,fetch()方法fetch()方法它是一个全新的网络请求API,内部不是对xhr的封装,内部是基于Promise对象对http请求的重新封装也是官方(W3C)推荐的方式,只是目前还没有完全流行开。