关于Promise 异步编程的实例讲解

实例如下所示：

//1.解决异步回调问题
//1.1 如何同步异步请求
//如果几个异步操作之间并没有前后顺序之分,但需要等多个异步操作都完成后才能执行后续的任务，无法实现并行节约时间

const fs = require('fs');
let school = {};
fs.readfile('./name.txt','utf8',function (err,data) {
  school.name = data;
});
fs.readfile('./age.txt','utf8',function (err,data) {
  school.age = data;
});
console.log(school);
//1.2如何解决回调地狱
//在需要多个操作的时候，会导致多个回调函数嵌套，导致代码不够直观，就是常说的回调地狱

const fs = require('fs');
fs.readfile('./content.txt','utf8',function (err,data) {
  if(err)console.log(err);
  fs.readfile(data,'utf8',function (err,data) {
    if(err)console.log(err);
    console.log(data);
  })
});
//2.promise
//promise本意是承诺，在程序中的意思就是承诺我过一段时间后会给你一个结果。 什么时候会用到过一段时间？答案是异步操作，异步是指可能比较长时间才有结果的才做，例如网络请求、读取本地文件等

//3.promise的三种状态
//例如媳妇说想买个包，这时候他就要"等待"我的回复，我可以过两天买，如果买了表示"成功"，如果我最后拒绝表示"失败"，当然我也有可能一直拖一辈子

//pending promise对象实例创建时候的初始状态
//fulfilled 可以理解为成功的状态
//rejected 可以理解为失败的状态
//then 方法就是用来指定promise 对象的状态改变时确定执行的操作，resolve 时执行第一个函数（onfulfilled），reject 时执行第二个函数（onrejected）
//4.构造一个promise
//4.1 promise的方法会立刻执行
let promise = new promise(()=>{
  console.log('hello');
});
console.log('world');
//4.2 promise也可以代表一个未来的值
const fs = require('fs');
let promise = new promise((resolve,reject)=>{
  fs.readfile('./content.txt','utf8',function (err,data) {
    if(err)console.log(err);
    resolve(data);
  })
});
promise.then(data =>{
  console.log(data);
});
//4.3 代表一个用于不会返回的值
const fs = require('fs');
let promise = new promise((resolve,reject)=>{});
promise.then(data =>{
  console.log(data);
});
//4.4 应用状态实现抛硬币
function flip_coin() {
  return new promise((resolve,reject)=>{
    settimeout(function () {
      var random = math.random();
      if(random > 0.5){
        resolve('正');
      }else{
        resolve('反');
      }
    },2000)
  })
}
flip_coin().then(data=>{
  console.log(data);
},data=>{
  console.log(data);
});
//5.实现简单的promise
function promise(fn) {
  fn((data)=>{
    this.resolve(data)

  },(data)=>{
    this.reject(data);
  })
}
promise.prototype.resolve = function (data) {
  this._success(data)
};
promise.prototype.reject = function (data) {
  this._error(data);
};
promise.prototype.then = function (success,error) {
  this._success = success;
  this._error = error;
};
//6.error会导致触发reject
//可以采用then的第二个参数捕获失败，也可以通过catch函数进行捕获

function flip_coin() {
  return new promise((resolve,reject)=>{
    throw error('没有硬币')
  })
}
flip_coin().then(data=>{
  console.log(data);
}).catch((e)=>{
  console.log(e);
})
//7.promise.all实现并行
//接受一个数组，数组内都是promise实例，返回一个promise实例，这个promise实例的状态转移取决于参数的promise实例的状态变化。当参数中所有的实例都处于resolve状态时，返回的promise实例会变为resolve状态。如果参数中任意一个实例处于reject状态，返回的promise实例变为reject状态

const fs = require('fs');
let p1 = new promise((resolve,reject)=>{
  fs.readfile('./name.txt','utf8',function (err,data) {
    resolve(data);
  });
})
let p2 = new promise((resolve,reject)=>{
  fs.redfile('./age.txt','utf8',function (err,data) {
    resolve(data);
  });
})
promise.all([p1,p2]).then(([res1,res2])=>{
  console.log(res1);
})
//不管两个promise谁先完成，promise.all 方法会按照数组里面的顺序将结果返回
//8.promise.race实现选择接受一个数组，数组内都是promise实例,返回一个promise实例，这个promise实例的状态转移取决于参数的promise实例的状态变化。当参数中任何一个实例处于resolve状态时，返回的promise实例会变为resolve状态。如果参数中任意一个实例处于reject状态，返回的promise实例变为reject状态。

const fs = require('fs');
let p1 = new promise((resolve,reject)=>{
  fs.readfile('./name.txt','utf8',function (err,data) {
    resolve(data);
  });
})
let p2 = new promise((resolve,reject)=>{
  fs.readfile('./age.txt','utf8',function (err,data) {
    resolve(data);
  });
})
promise.race([p1,p2]).then(([res1,res2])=>{
  console.log(res1,res2);
})
9.promise.resolve
//返回一个promise实例，这个实例处于resolve状态。

promise.resolve('成功').then(data=>{
  console.log(data);
})
10.promise.reject
//返回一个promise实例，这个实例处于reject状态

promise.reject('失败').then(data=>{
  console.log(data);
},re=>{
  console.log(re);
})
//11.封装ajax
function ajax({url=new error('url必须提供'),method='get',async=true,datatype='json'}){
 return new promise(function(resolve,reject){
   var xhr = new xmlhttprequest();
   xhr.open(method,url,async);
   xhr.responsetype = datatype;
   xhr.onreadystatechange = function(){
     if(xhr.readystate == 4){
       if(/^2\d{2}/.test(xhr.status)){
        resolve(xhr.response);
       }else{
         reject(xhr.response);
       }
     }
   }
   xhr.send();
 });
}
//12.chain中返回结果
promise.resolve([1,2,3])
.then(arr=>{
  return [...arr,4]
}).then(arr=>{
  return [...arr,5]
}).then(arr=>{
  console.log(arr);
})
//13.chain中返回promise
//then中的结果是promise的resolve后的结果

promise.resolve('user').then(data=>{
  return new promise(function (resolve,reject) {
    fetch('/'+data).then(res=>res.json().then((json)=>{
      resolve(json)
    }))
  })
}).then(data=>{
  console.log(data);
});
//改写的更简单些

promise.resolve('user').then(data=>{
  return fetch('/'+data)
}).then(res=>{
  return res.json();
}).then(data=>{
  console.log(data);
})
//14.async/await
//本质是语法糖，await与async要连用，await后只能跟promise

async function gethello() {
  return new promise((resolve,reject) => {
    settimeout(function () {
      resolve('hello');
    },2000);
  })
}
async function getdata () {
  var result = await gethello();
  console.log(result);
} ;
getdata();

以上这篇基于promise 异步编程的实例讲解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。