一：Promise是什么？

（1）Promise是JS中进行异步编程的解决方案
     备注：旧方案是单纯使用回调函数
     异步编程包括：fs文件操作、数据库操作、AJAX、定时器......
（2）从语法上来说：Promise是一个构造函数
（3）从功能上来说：Promise对象用来封装一个异步操作并可以获取其成功/失败的结果值

二：Promise有什么用？

（1）指定回调函数的方式更加灵活
（2）支持链式调用，可以解决回调地狱问题

初认识Promise

<body>
    <div class="container">
        <button class="btn" id="btn">点击抽奖</button>
    </div>
    <script>
        // 生成随机数
        function random(m,n){
            return Math.floor(Math.random()*(Math.abs(m-n)+1))+Math.min(m,n)
        }

        /*
            点击按钮  2s后显示是否中奖 （30%的概率中奖） 
            若中奖则弹出    恭喜你，中奖了，奖品为5000RMB奔驰优惠劵
            若未中奖则弹出  很遗憾，没中奖，再接再厉哦
         */

        //  获取对象元素
        const btn = document.querySelector("#btn")
        // 绑定单击事件
        btn.addEventListener('click',function(){
            // 定时器   异步代码
            /* setTimeout(()=>{
                // 30%中奖几率  获取1~100的随机数
                let n = random(1,100)
                if(n<=30){
                    alert("恭喜你，中奖了，奖品为5000RMB奔驰优惠劵")
                }else{
                    alert("很遗憾，没中奖，再接再厉哦")
                }
            },1000) */

            // Promise形式实现
            // resolve 解决  函数类型的数据
            // reject  拒绝  函数类型的数据
            const p = new Promise((resolve,reject)=>{
                setTimeout(() => {
                    // 30%中奖几率  获取1~100的随机数
                    let n = random(1, 100)
                    if (n <= 30) {
                        resolve(n) //将Promise对象的状态设置为 成功
                    } else {
                        reject(n)  //将Promise对象的状态设置为 失败
                    }
                }, 1000);
            })

            // 调用then方法  有两个参数
            // 第一个参数是 Promise对象成功时的回调函数  value是回调函数的形参 实参为Promise对象成功时resolve()中的内容
            // 第二个参数是 Promise对象失败时的回调函数  reason是回调函数的形参 实参为Promise对象失败时reject()中的内容
            p.then((value)=>{
                alert("恭喜你，中奖了，奖品为5000RMB奔驰优惠劵，中奖号码为"+value)
            },(reason)=>{
                alert("很遗憾，没中奖，再接再厉哦，你的号码为"+reason)
            })
        })
    </script>
</body>

526互联

Promise的理解和使用

一：Promise是什么？

二：Promise有什么用？