Promise

作者: ticktackkk | 来源:发表于2020-09-16 17:22 被阅读0次
  • 1.es6为什么会出现promise/解决了什么问题
  • 2.promise的使用场景
  • 3.promise的使用方法
  • 4.如何使用

1.

JavaScript实现异步执行,在Promise未出现前,我们通常是使用嵌套的回调函数来解决的。但是使用回调函数来解决异步问题,简单还好说,但是如果问题比较复杂,我们将会面临回调金字塔的问题

杂乱的一些笔记
1 在封装函数里面使用


2 .then()里面的两个参数(第一个是成功的回调,第二个是失败的回调)

promise.then(
    (ok) => {
      console.log("ok");
    },
    (err) => {
      console.log("im not ok");
    }
  );

3.promise比回调函数好处在哪?
可以指定回调成功和失败的时间
比如说

  const p = new Promise((reject, resolve) => {
    setTimeout(() => {
      reject("成功的回调");
    }, 1000);
  });

  setTimeout(() => {
    p.then((value) => {
      console.log(value);
    });
  }, 1000);

4.指定一个成功的promise和失败的promise

const p2=Promise.reject(2)
  const p3=Promise.resolve(3)

5.Promise.all(Array)
Promise.all方法用于将多个Promise实例,包装成一个新的Promise实例。
只要一个错误就返回rejected,全部为fulfilled返回fulfilled
返回的是reject或resolve实例的返回值

  const p1 = new Promise((reject, resolve) => {
    setTimeout(() => {
      reject(1);
    }, 1000);
  });

  const p2 = Promise.reject(2);
  const p3 = Promise.resolve(3);
  const all = Promise.all([p1, p3]);
  all.then(
    (value) => console.log("成功的数据" + value),//1 2
    (reason) => console.log("失败的原因" + reason)
  );

6.Promise.race([])
race之中有一个实例率先改变状态,他的实例对象就跟着改变

  const p1 = new Promise((reject, resolve) => {
    setTimeout(() => {
      reject(1);
    }, 1000);
  });

  const p2 = Promise.reject(2);
  const p3 = Promise.resolve(3);
  const all = Promise.rece([p1,p2 p3]);
  pRace.then(
    (value) => console.log(value)
    (reason) => console.log(reason)
  );

手写一个promise----未完成

(function (window) {
  function Promise(excutor) {
    //执行器函数(同步执行)
    (this.status = "pading"), //指定初始值为pading
      (this.data = undefined), //给promise对象指定一个用于存储结果数据的值
      (this.callbacks = []); //每个元素的结构[onResolved(){},onRejected(){}]

    function resolve(value) {
        //如果状态值不是pading,直接结束
      if (this.status !== "pading") return;

      //将状态改变为resolved
      this.status = "resolved";
      //保存value的数据
      this.data = value;

      //如果有待执行的callbacks函数,立即执行异步回调函数onResolved
      if (this.callbacks.length > 0) {
        setTimeout(() => {
          //放入队列中所有成功的回调
          this.callbacks.forEach((callbacksObj) => {
            //使其异步执行
            callbacksObj.onResolved(value);
          });
        }, 0);
      }
    }
    function reject(reason) {
        //如果状态值不是pading,直接结束
      if (this.status !== "pading") return;
      //将状态改变为rejected
      this.status = "rejected";
      //保存value的数据
      this.data = reason;

      //如果有待执行的callbacks函数,立即执行异步回调函数onRejected
      if (this.callbacks.length > 0) {
        setTimeout(() => {
          //放入队列中所有成功的回调
          this.callbacks.forEach((callbacksObj) => {
            //使其异步执行
            callbacksObj.onRejected(reason);
          });
        }, 0);
      }
    }
    try {//如果执行器抛出异常,我们就执行reject(),promise对象变为失败
        excutor(resolve, reject); //立即同步执行excutor
    } catch (error) {
        reject(error)
    }
  }
  //指定一个新的成功或者失败的prmise的对象
  Promise.prototype.then = function (onResolve, onReject) {};
  Promise.prototype.then = function (onReject) {};
  //返回一个指定结果成功或者失败的promise
  Promise.resolve = function (value) {};
  Promise.reject = function (reason) {};
  //返回一个promise,只有当所有成功是才成功,否则失败
  Promise.all = function (promises) {};
  //返回一个promise,结果有第一个完成的promise决定
  Promise.race = function (promises) {};

  window.Promise = Promise;
})(window);

相关文章

网友评论

      本文标题:Promise

      本文链接:https://www.haomeiwen.com/subject/zvlfyktx.html