promise浅理解

最新推荐文章于 2024-06-10 15:10:52 发布

前端小臂猿

最新推荐文章于 2024-06-10 15:10:52 发布

阅读量154

点赞数

文章标签： javascript html 前端

本文链接：https://blog.csdn.net/m0_64337756/article/details/123807792

版权

一.promise函数的基本特征

<!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>特征</title>
</head>
<body>
  
</body>
</html>
<script>
  // promise意为承诺，基本特点：
  // 1）promise对象有三种状态：等待期（pending）, 成功（fulfilled），失败（rejected）；
  // 2）promise状态的变换，等待=>成功，等待=>失败；状态一旦改变后就不能再被改变，称为已定型。
  // 3）resolve() 和 reject() 的参数会保存在promise对象中。
  let p1 = new Promise((resolve,reject)=>{
    // 根据异步语法的结果修改promise对象的状态
    setTimeout(() => {
      // reject("失败"); //使用reject()将promise对象从pending改成rejected
      resolve("成功了"); //使用resolve()将promise对象从pending改成fulfilled

    }, 2000);
  });

  console.log( p1 );
</script>

二.promise对象的方法

<!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>方法</title>
</head>
<body>
  
</body>
</html>
<script>
    let p1 = new Promise((resolve,reject)=>{
    // 根据异步语法的结果修改promise对象的状态
    setTimeout(() => {
      reject("失败"); //使用reject()将promise对象从pending改成rejected
      // resolve("成功了"); //使用resolve()将promise对象从pending改成fulfilled
    }, 2000);
  });

  p1.then((data)=>{
    alert( data );
  });
  p1.catch((err)=>{
    alert( err )
    // console.log( err );
  });

  
</script>

三.promise封装函数

let fs = require("fs");

function appendFile(url,str) {
  return new Promise((resolve,reject)=>{
    // 根据异步操作的结果来修改promise对象的状态
    fs.appendFile(url,str,(err)=>{
      if(!err){
        resolve("追加成功"); // resolve()改成功状态
      }else{
        reject("追加失败"); //reject()改失败状态
      }
    }) 
  })
}
// let p1 = appendFile("./ok.txt","4");
appendFile("./ok.txt","1")
.then((data)=>{
  console.log( data );
  return appendFile("./ok.txt","2")
}).then((data)=>{
  console.log( data );
  return appendFile("./ok.txt","3")
}).catch((err)=>{
  console.log( err );
})

四. promise.all方法

let fs = require("fs");

function appendFile(url,str) {
  return new Promise((resolve,reject)=>{
    // 根据异步操作的结果来修改promise对象的状态
    fs.appendFile(url,str,(err)=>{
      if(!err){
        resolve("追加成功"); // resolve()改成功状态
      }else{
        reject("追加失败"); //reject()改失败状态
      }
    }) 
  })
}
// all() 中可以集合多个promise对象，会等待所有的promise对象都变成成功状态（即所有异步操作都成功了），才执行then()方法
Promise.all([
  appendFile("./ok.txt","0000"),
  appendFile("./ok.txt","1111"),
  appendFile("./ok.txt","2222"),
  appendFile("./ok.txt","3333"),
]).then((data)=>{
  console.log( data );
  console.log("都写入完成了");
})

五. promise函数封装

let fs = require("fs");

function readFile(url) {
  return new Promise((resolve,reject)=>{
    // 根据异步操作的结果来修改promise对象的状态
    fs.readFile(url,(err,result)=>{
      if(!err){
        resolve( result ); // resolve()除了改promise为成功状态，还可以将读取的文件内容存储在promise对象中
      }else{
        reject(err); //reject()改失败状态,同时可以将错误消息存储在promise对象中。
      }
    }) 
  })
}

readFile("./ok.txt").then( (data)=>{
  console.log( data.toString() );
} )

前端小臂猿

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
promise浅理解

一.promise函数的基本特征<!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"> <t
复制链接

扫一扫