JavaScript的Promise自我初步认知1

88 阅读1分钟

Promise是什么

  1. Promise是一个构造函数
  2. Promise是ES6的一个方法
  3. Promise是用来解决异步函数的

Promise有什么作用

  1. Promise可以解回调地狱
  2. Promise可以封装一个异步操作,并返回成功或者失败的结果

代码体验一下Promise

// 需求是做一个抽奖活动,等待结果时间为2秒
// 中奖概率是30%
// 中奖范围是1-100
    ---------------------------------不使用promise----------------------------------
<button id="btn">点击抽选今日甜品</button>

let btn = document.querySelector('#btn')
//封装一个随机数字方法
function rand(m,n){
    return Math.ceil(Math.random(n-m+1)) * m - 1
}
btn.addEventListener('click', function () {
        steTimeOut(() => {
            const n = rand(1, 100)
            if (n <= 30) {
                alert('恭喜你获得今日甜品')
            } else {
                alsrt('很遗憾,今天你吃不到甜品了')
            }
        }, 2000)
    // ---------------------------------使用promise---------------------------------
    const promise = new Promise((resolve, reject) => {
        setTimeOut(() => {
            const n = rand(1, 100)
            if (n <= 30) {
                resolve(n)
            } else {
                reject(n)
            }
        }, 2000)
    })
    promise.then((value) => {
            alert(`恭喜中奖获得甜品一块,中奖数字为${value}`)
        }, (reason) => {
            alert(`很遗憾今天的甜品没有了,当前数字为${reason}`)
        })
   })