Promise第一天学习(基于B站尚硅谷Promise学习)

异步操作

  1. fs文件(fs是node下的一个模块,可以对磁盘进行修改)
    require('fs').readFile('./index.html',(err,data)=>{})
    
  2. 数据库操作
  3. Ajax
    $.get('/server',(data)=>{})
    
  4. 定时器
    setTimeout(()=>{},2000);
    

基础特点

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

promise 初步体验

要求:

  1. 设置按钮进行抽奖
  2. 设置一秒延时
  3. 设置30%概率中奖
  4. 出现结果给出弹窗(含有原生与promise形式实现,主要区别在于JS)
    <!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>Document</title>
    
     <style>
    
     button{
    
     width: 200px;
    
     height: 200px;
    
     background-color: blue;
    
     }
    
     </style>
    
    </head>
    
    <body>
    
     <button>点击抽奖</button>
    
     <script>
    
     //生成随机数
    
     function rand(m,n){
    
     //返回向上取整的数值,并控制再m,n之间
    
     return Math.ceil(Math.random() * (n-m+1)) + m + 1 ;
    
     }
    
     //获取元素对象
    
     const btn = document.querySelector('button')
    
     //设置定时器
    
     btn.addEventListener('click',function(){
    
     //Promise对象实例化
    
     //resolve与reject是自定义的两个变量,一般写为这两种
    
     //成功时用resolve,失败时用reject
    
     const p = new Promise((resolve,reject)=>{
    
     setTimeout(() => {
    
     //设置百分之三十的概率中奖
    
     let n = rand(1,100);
    
     if(n<=30){
    
     resolve(); //调用时讲promise的对象设置为成功
    
     }else{
    
     reject(); //调用时讲promise的对象设置为失败
    
     }
    
     },1000)
    
     });
    
     //调用then方法,指定回调函数
    
     p.then((resolve)=>{
    
     alert('恭喜中奖')
    
     },(reject)=>{
    
     alert('再接再厉')
    
     })
    
     })
    
     </script>
    
    </body>
    
    </html>
    

    要求增加:若是成功返回中奖数字

     const p = new Promise((resolve,reject)=>{
    
     setTimeout(() => {
    
     //设置百分之三十的概率中奖
    
     let n = rand(1,100);
    
     if(n<=30){
    
     resolve(n); //调用时讲promise的对象设置为成功
    
     }else{
    
     reject(n); //调用时讲promise的对象设置为失败
    
     }
    
     },1000)
    
     });
    
     //调用then方法,指定回调函数
    
     p.then((value)=>{
    
     alert('恭喜中奖' + value)
    
     },(reason)=>{
    
     alert('再接再厉' + reason)
    
     })
    
     })
    

promise封装fs使用

//创建FS实例对象

const fs = require('fs');

//创建promise对象

let p = new Promise((resolve,reject)=>{

 fs.readFile('./fist.txt',(err,data)=>{

 //如果出错

 if(err){

 reject(err);

 }else{

 resolve(data);

 }

 })

 p.then((value)=>{

 console.log(value.toString());

 },(reason)=>{

 console.log(reason);

 })

})
上一篇:Facebook曝至今最严重安全漏洞,超过5000万用户受影响


下一篇:Promise