Promise第一天学习(基于B站尚硅谷Promise学习)
作者:互联网
异步操作
- fs文件(fs是node下的一个模块,可以对磁盘进行修改)
require('fs').readFile('./index.html',(err,data)=>{})
- 数据库操作
- Ajax
$.get('/server',(data)=>{})
- 定时器
setTimeout(()=>{},2000);
基础特点
- 支持链式调用,可以解决回调地狱问题
- 指定回调函数的方式更加灵活
promise 初步体验
要求:
- 设置按钮进行抽奖
- 设置一秒延时
- 设置30%概率中奖
- 出现结果给出弹窗(含有原生与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);
})
})
标签:fs,const,学习,resolve,Promise,reject,中奖,硅谷 来源: https://www.cnblogs.com/mrchenxizhi/p/15831484.html