ES6中Promise使用必要

不使用promise请求数据,请求成功后将数据给一个变量保存，然后在下面打印

function response() {
        let xml = new XMLHttpRequest()
        xml.open('GET', url)
        xml.onreadystatechange = function() {
          if (xml.status == 200 && xml.readyState == 4) {
            console.log(xml.response)
            Object.assign(json,xml.response)
          }
        }
        xml.responseType = "json"
        xml.setRequestHeader("Accept", "application/json")
        xml.send();
        console.log(json)//{}
      }
      response()

上面执行完请求后打印获取的数据，控制台打印一个空对象，就是因为请求是异步操作，请求没有完成console.log就执行了，所以控制台打印的是原来的信息，就是请求的时间中，下面的代码正常执行，使用promise将异步操作执行完再执行console.log就可以获取想要的信息了

function createAsync(url) {
        let promise = new Promise((resolve, reject) => {
          let xml = new XMLHttpRequest()
          xml.open('GET', url)
          xml.onreadystatechange = function() {
            //等readyState == 4 再往下执行
            if(xml.readyState !== 4){
              return;
            }
            if (xml.status == 200) {
              resolve(xml.response)//resolve中的信息传到下面.then第一个函数的参数中
              Object.assign(json,xml.response)//把获取的数据给json变量
            }else{
              reject(new Error("Ou no!"))
            }
          }
          xml.responseType = "json"
          xml.setRequestHeader("Accept", "application/json")
          xml.send();
        })
        return promise
      }
      
      createAsync(url)
      .then(function (res) {
        console.log(res)//{userId: 1, id: 1, title: "delectus aut autem", completed: false}
        console.log(json)//{userId: 1, id: 1, title: "delectus aut autem", completed: false}
      },function (err) {
        console.log(err)
      })

简单来说就是把原来的普通ajax请求放到promise中，js给提供好的promise两个参数一个成功时返回，另一个失败时返回，而返回的数据在下面promise函数执行完毕时的.then操作获取，在.then中对获取到的数据进行操作，就会保证此时数据已经正确获取到了，或者返回一个err