Ajax中一些常见的实例化对象

FormData 表单数据对象

• 以键值对形式存放数据的容器，常用于装载文件对象

  1.创建FormData 对象

 // 创建formData
const fd = new FormData()

  2.添加数据

// 添加数据
// FormData对象.append(属性名,属性值)
fd.append('id',110)
fd.append('name',‘呵呵大王)

  3.遍历FormData对象

FormData对象可以使用forEach进行遍历

// forEach可用于遍历formData对象
fd.forEach((value,key) => {
    console.log(value,key)
})

 XMLHttpRequest

• XHR对象用于与服务器交互

  使用XHR对象实现与服务器的交互

<script>
    // 创建xhr对象
    let xhr = new XMLHttpRequest()
    // 传参 获取湖北省下的城市
    xhr.open('GET','http://hmajax.itheima.net/api/city?pname=湖北省')
    // 发送请求
    xhr.send()
    // load请求事件 获取数据
    xhr.addEventListener('load', function() {
    // 服务器返回的数据存在xhr对象的response属性中 是JSON字符串类型的
       console.log(xhr.response)  
</script>

 Promise对象

  Promise对象用于解决回调地狱问题的原生js对象

  Promise的经典格式

<script>
    const p = new Promise((resolve,rejecte) => {
        //resolve(参数)
        //rejecte(参数)
    })

    p.then(res => {
        // 成功状态时执行的代码
    }).catch(err => {
        // 失败状态时执行的代码
    }).finally(() => {
        // 无论什么状态都会执行的代码
    })

</script>

  Promise的三种状态

     pending: 准备； resolved(或者fulfilled)：成功； rejected： 失败

• 准备：new实例化后, Promise对象的状态为pending 准备状态
• 成功：当Promise内代码执行了resolve, Promise对象的状态变成fulfilled 成功状态
• 失败：当Promise内代码执行了reject,Promise对象的状态变成rejected 失败状态

  从准备状态进入成功状态或者失败状态是不可逆的

  Promise的值

• 当Promise对象执行resolve进入成功状态时，resolve携带的参数传递给then中的res
• 当Promise对象执行reject进入成功状态时，rejected携带的参数传递给catch中的err