ES8——async和await

最新推荐文章于 2024-04-02 19:34:02 发布

野生小米椒

最新推荐文章于 2024-04-02 19:34:02 发布

阅读量116

点赞数

分类专栏： ES6

本文链接：https://blog.csdn.net/x1037490413/article/details/119537724

版权

ES6 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

在这里插入图片描述

1.async和await使用

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script type="module">
      //创建promise对象
      const p = new Promise((resolve, reject) => {
        resolve("成功的数据");
        //  reject('失败的数据')
      });
      //await要放在async函数中
      async function fn(){
        try{
          let result=await p;
          console.log(result);
        }catch(e){
          console.log(e);
        }
      }
      fn()
    </script>
  </body>
</html>

2.async和await结合读取文件

在这里插入图片描述

const fs=require('fs')
function SH(){
  return new Promise((resolve,reject)=>{
    fs.readFile("./resources/上海.md",(err,data)=>{
      if(err) reject(err)
      resolve(data)
    })
  })
}
function SZ(){
  return new Promise((resolve,reject)=>{
    fs.readFile("./resources/深圳.md",(err,data)=>{
      if(err) reject(err)
      resolve(data)
    })
  })
}
function XG(){
  return new Promise((resolve,reject)=>{
    fs.readFile("./resources/香港.md",(err,data)=>{
      if(err) reject(err)
      resolve(data)
    })
  })
}
async function test(){
  try{
  const result1=await SH()
  const result2=await SZ()
  const result3=await XG()
  console.log(result1.toString());
  console.log(result2.toString());
  console.log(result3.toString());
  }catch(e){
    console.log(e);
  }
 
}
test()

3.async和await结合发送Ajax请求

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script type="module">
     //发送Ajax请求，返回的结果是Promise对象
     function sendAjax(url){
     return new Promise((resolve,reject)=>{
      const xhr=new XMLHttpRequest()
      xhr.open('GET',url)
      xhr.send()
      xhr.onreadystatechange=function(){
        if(xhr.readyState){
          if(xhr.status>=200&&xhr.status<300){
            resolve(xhr.response)
          }else{
            reject(xhr.status)
          }
        }
      }
     })
     }
     //promise then方法测试
    //  sendAjax("https://api.apiopen.top/getJoke").then(value=>{
    //    console.log(value);
    //  },reason=>{
    //    console.log(reason);
    //  })
     //async与await测试
    async function test(){
     let result= await sendAjax("https://api.apiopen.top/getJoke")
     console.log(result);
    }
    test()
    </script>
  </body>
</html>

野生小米椒

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ES8——async和await

1.async和await使用<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" .
复制链接

扫一扫