首页 > 其他分享> > 关于ES6的promise和ES7的yield

关于ES6的promise和ES7的yield

2022-02-04 11:33:33 作者：互联网

关于ES6的promise和ES7的yield 1.promise

1 基本概念

名称：译为“承诺”，这也就表达了将来会执行的操作，代表异步操作；
状态：一共有三种状态，分别为pending（进行中）、fulfilled（已成功）和rejected（已失败）。
特点： (1)只有异步操作可以决定当前处于的状态，并且任何其他操作无法改变这个状态； (2)一旦状态改变，就不会在变。状态改变的过程只可能是：从pending变为fulfilled和从pending变为rejected。如果状态发生上述变化后，此时状态就不会在改变了，这时就称为resolved（已定型）

2 如何创造一个promise 如何创建一个promise（直接执行） const promise = new Promise((resolve,reject) => { if(sucess) { resolve(value); }else { reject(error) } ) 注意：对于promose对象如果直接使用new的话则会直接执行，想要定义则使用函数来定义这么一个异步操作方法2（异步操作不会立刻执行） function runAsync(){ var p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function(){ console.log('执行完成'); resolve('随便什么数据'); }, 2000); }); return p; } runAsync()

resolve和reject与then是什么关系比如我们在resolve函数中定义的 function runAsync(){ var p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function(){ console.log('执行完成'); resolve('随便什么数据'); }, 2000); }); return p; } runAsync() 异步执行完runAsync后，如果再用 runAsync().then(res=>{ console.log(res); }) 此时就会打印出 '随便什么数据' 异步操作的reject和resolve在then中的回调体现

    function runAsync(){
      let p = new Promise(function(resolve, reject){
          //做一些异步操作
          setTimeout(function (){
            let  num=Math.ceil(Math.random()*10);
            if(num<5) {
resolve(num);
            }else{
              reject('数字太大了！')
            }
          }, 2000);
      });
      return p;
  };
  runAsync().then(function(data){
    console.log('resolve');
    console.log(data)
  },function(data) {
    console.log('reject');
    console.log(data)
  });

最后如果这个数字大于5 则会打印出 Promise {<pending>}39787b1918052d26d1c92ea7ecfacad86e8dbfa2 VM296:19 reject VM296:20 数字太大了！ 3 promise.all

全部成功的话则会返回所有执行成功的resolve的回调

var p1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'one');
});
var p2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 2000, 'two');
});
var p3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 3000, 'three');
});
var p4 = new Promise((resolve, reject) => {
  resolve('p4 reject!');
});
var p5 = new Promise((resolve, reject) => {
  resolve('p5 resolve!');
});
 
 
Promise.all([p1, p2, p3, p4, p5]).then(values => {
  console.log(values);
}, reason => {
  console.log(reason)
});

Promise {<pending>} VM412:18 (5) ["one", "two", "three", "p4 reject!", "p5 resolve!"] 参数中任意一个promise返回失败时，那么整体立即返回失败，返回的错误信息是第一个失败的promise结果。

var p1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'one');
});
var p2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 2000, 'two');
});
var p3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 3000, 'three');
});
var p4 = new Promise((resolve, reject) => {
  reject('p4 reject!');
});
var p5 = new Promise((resolve, reject) => {
  reject('p5 reject!');
});
 
 
Promise.all([p1, p2, p3, p4, p5]).then(values => {
  console.log(values);
}, reason => {
  console.log(reason)
});
VM425:20 p4 reject!

4 promise.race race有赛跑之译，因此返回的新实例状态，是跟随参数中最先改变状态的那个实例；如果不是Promise实例，依旧先用Promise.resolve方法，转化后再进一步处理。如果传的迭代为空，则返回的 Promise 永远等待

var p1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'one');
});
var p2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 2000, 'two');
});
var p3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 3000, 'three');
});
 
 
Promise.race([p1, p2, p3]).then(values => {
  console.log(values);
}, reason => {
  console.log(reason)
});
Promise {<pending>}
VM446:12 one

2.async和await 1基本概念https://www.haorooms.com/post/es67application

简单的停顿执行

var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve();
}, time);
})};
 
var start = async function () {
console.log('start');
await sleep(3000);
console.log('end');};
 
start();

获得返回值

var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
// 返回 ‘ok’
resolve('ok');
}, time);
})};
 
var start = async function () {
let result = await sleep(3000);
console.log(result); // 收到 ‘ok’};
start()

捕捉错误

var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
// 模拟出错了，返回 ‘error’
reject('error');
}, time);
})};
 
var start = async function () {
try {
console.log('start');
await sleep(3000); // 这里得到了一个返回错误
 
// 所以以下代码不会被执行了
console.log('end');
} catch (err) {
console.log(err); // 这里捕捉到错误 `error`
}};
start()

标签：ES7,ES6,resolve,function,new,promise,reject,var,Promise
来源： https://www.cnblogs.com/chuxuezhe-ZP/p/15862594.html