JavaScript异步使用

辨析
1.同步：一个任务一个任务逐个完成，前一个任务完成后才开始下一个任务
2.异步：同时进行多个任务

异步编程：异步编程允许程序在执行一些耗时操作时,不会阻塞主线程的执行,而是让程序继续向下执行

应用于：
1.事件监听
2.定时器
3.网络请求
4.文件I/O
5.数据库操作

回调函数

回调函数：把一个函数作为参数传给另一个函数，当耗时操作完成时，调用这个回调函数

function downloadFile(url,callback){
     console.log("开始下载文件...");
      //假设下载需要5秒
      setTimeout(function(){
          console.log("文件下载完成");
          callback(null,"文件内容")
       },5000)
}
console.log("开始程序");
downloadFile("这里是文件链接",function(err,data){
     if(err){
          console.log("下载失败",err);
      }else{
          console.log("下载成功",data);
      }
});
console.log("程序继续执行");
//这个例子中downloadFile函数是一个异步操作，他会在5秒后完成文件下载，然后调用传入的回调函数来告知结果
//但是容易引起回调地狱问题，代码变得难以维护和理解
//输出结果：开始程序  开始下载文件  程序继续执行

Promise

Promise 对象代表一个异步操作的最终成功resolve()或失败 reject()

// 文件下载异步操作
function downloadFiles(url) {
  return new Promise((resolve, reject) => {
    console.log("开始文件下载");
    // 假设下载需要5秒
    setTimeout(() => {
      console.log("文件下载完成");
      resolve("文件内容");
    }, 5000);
  });
}

console.log("开始程序");
//调用downloadFiles函数，文件链接2当参数，返回promise对象
downloadFile("这是文件链接2")
//.then()处理成功结果
  .then((data) => {
    console.log("下载完成", data);
  })
//.catch()处理失败结果
  .catch((err) => {
    console.log("下载失败", err);
  });
//异步函数，程序继续执行
console.log("程序继续执行");
//在这个例子中,downloadFile 函数返回一个 Promise 对象。当异步操作完成时,Promise 会调用 resolve 或 reject 函数来表示成功或失败。使用 .then() 方法,我们可以处理成功的结果,使用 .catch() 方法,我们可以处理失败的情况。
//输出结果：开始程序  开始文件下载  程序继续执行  文件下载完成  下载完成  文件内容

async/await语法

让异步代码开起来像同步代码

//定义异步函数
async function downloadAndProcess() {
        try {
            console.log("开始程序");
//await等待异步函数返回的结果，返回promise对象开始文件下载，promise完成，函数执行
            const data = await downloadFile("https://example.com/file.txt");
            console.log("下载成功,文件内容为:", data);
         } catch (err) {
            console.error("下载失败:", err);
         }
//downloadFile完成后执行
          console.log("程序继续执行");
     }

     downloadAndProcess();
//输出结果：开始程序  下载成功,文件内容为: 文件内容  程序继续执行