前端Promise 自用文档

最新推荐文章于 2024-04-18 09:12:02 发布

举个栗子 .

最新推荐文章于 2024-04-18 09:12:02 发布

阅读量445

点赞数 6

文章标签：前端

本文链接：https://blog.youkuaiyun.com/zhuxiaolong1234/article/details/136628513

版权

<!--
 * @FilePath: let.html
 * @Author: 是十九呐
 * @Date: 2023-11-07 11:07:38
 * @LastEditTime: 2024-03-11 16:52:11
-->
<html>
<!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Let</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
        integrity="sha384-ggOyR0i><" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>

<html lang="en">

<body>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <h1>Let</h1>
                <p>The let keyword is used to declare a variable. It is used to declare a variable that can be
                    reassigned later</p>
            </div>
        </div>
    </div>

    <script>
        // promise 是ES6引入的异步编程的新解决方案。语法上Promise是一个构造函数，用来封装异步操作并且可以获取其成功或者是失败的结果
        // 实例化Promise对象 把异步任务封装到Promise里面
        // const  p = new Promise(function(resolve,reject){
        //     // 这里面可以进行异步操作 例如 setTimeout
        //     setTimeout(() => {
        //         let a = '调用成功'
        //         resolve(a)
        //         // 调用resolve之后 p会显示成功

        //         let err = '失败'
        //         reject(err)
        //     }, 1000);
        // })

        // // 调用promise里面的then方法 如果成功 调用.then第一个回调函数 如果失败就调用第二个回调函数
        // p.then(function(res){
        //     console.log("@@@@res",res);
        // },function(err){
        //     console.log("@@@@err",err);
        // })


        let b = new Promise((resolve,reject)=>{
            let a = '成功'
            resolve(a)
            // let b = '失败'
            // reject(b)
        })
        b.then(success=>{
            console.log('@@@@a',success);
        },err=>{
            console.log('@@@@b',err);
        })
    </script>
</body>

</html>

多层promise 解决地狱回调问题

/*
 * @FilePath: testPromise.js
 * @Author: 是十九呐
 * @Date: 2024-03-11 16:46:02
 * @LastEditTime: 2024-03-11 16:50:35
 */
let p = new Promise((resolve,reject)=>{
  fs.readFile("./resources/test1.md",(err,data) => {
    resolve(data)
  });
});

p.then(value=>{
  return new Promise((resolve,reject)=>{
    fs.readFile("./resources/test2.md",(err,data) => {
      resolve([value,data])
    });
  })
}).then(value=>{
  return new Promise((resolve,reject)=>{
    fs.readFile("./resources/test3.md",(err,data) => {
      value.push(data)
      resolve(value)
    });
  })
}).then(value=>{
  console.log(value)
})