10.24 Ajax day05 封装原生Ajax&async await

本文详细介绍了如何封装原生Ajax过程,包括设置参数、返回Promise对象、创建xhr对象并进行请求操作。同时,探讨了async和await的使用,强调它们在解决异步问题,尤其是回调地狱方面的优势。通过async函数,可以使得代码更易读,await后的Promise对象控制异步流程。
摘要由CSDN通过智能技术生成


1.封装过程

               创建函数 设置参数

                return Promise对象(四个参数)

                输出Promise 四参数

                创建xhr对象   

                    调用xhr.open()

                     调用xhr.send([请求体数据])  判断get 

                      监听load事件

 //  GET   http://www.liulongbin.top:3009/api/get
    //  POST  http://www.liulongbin.top:3009/api/post

    // 发送get请求
    function myaxios({method='get',url,params,data}){
        return new Promise((resolve,reject)=>{
         console.log(method,url,params,data) 
        //  发送请求,创建xhr
          let xhr=new XMLHttpRequest()
             
          // 把查询参数写到地址中
            if(params){
              let arr=[]
              for (let k in params){
                arr.push(`${k}=${params[k]}`)
                
                // let str=arr.join('&')
      
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值