一起来了解了解回调地狱及Promise

什么是回调地狱

回调地狱，就是函数作为参数层层嵌套
举个例子：

//封装的一个函数
function getSend(url, cb) { 
    var xhr = new XMLHttpRequest()
    xhr.open('GET', url)
    xhr.onload = function () {
    cb(xhr.responseText)
   }
   xhr.send()
 ｝

//发送第一个请求
 getSend('./server/a.php', function (res) {
 //res就是后端发回来的响应体
 var result = JSON.parse(res)
 //发送第二个请求
getSend(`./server/b.php?n1=${result.n1}&n2=${result.n2}`, function (res2) {
var result2 = JSON.parse(res2)
//发送的第三个请求
 getSend(`./server/c.php?and=${result2.and}&n3=${result2.n3}`, function (res3) {
 console.log(res3)
    	 })
      })
    })

当嵌套过多时，代码量变多，就形成了回调地狱，有时候会给我们带来麻烦，我们可以用Promise来解决

什么是Promise

Promise是es6中的一个内置构造函数，函数参数有两个参数 resolve reject ,分别为成功与失败之后的回调函数
语法: let p1 = new Promise(function () { 你要做的异步的事情 })
Promise对象里有两个方法：then catch
1.then 成功时执行这里面的回调函数
2.catch 失败时执行这里面的回调函数
Promise还有三个状态

• pending 继续, 也就是正在帮你做这个异步的事情
• fulfilled 成功, 结果
• rejected 失败, 结果
  举个例子

//先用定时器模拟一下
   var p1 = new Promise(function (resolve, reject) {
	var xhr = new XMLHttpRequest()
	xhr.open('GET', './server/a.php')
	xhr.onreadystatechange = function () {
	   if (xhr.status === 200 && xhr.readyState === 4) {
	   resolve(xhr.responseText)
	 ｝
	 if (xhr.status === 404) {
	      reject（'请求地址不对'）
	      ｝
	    ｝
	    xhr.send()
	 })
	 //then函数
	 p1.then(function (res) {
	    console.log('我执行了, 我表示成功')
	 )}
	 //catch函数
	 p1.catch(function () {
      	     console.log('我执行了, 我表示失败')
         })

这只是最简单的例子，还可以链式调用，还可以使用Promise的方式二次封装 ajax，然后使我们的代码看起来更简洁，用着更方便，我在这里就不举例子了，还是自己慢慢敲慢慢琢磨理解的深刻。