zoukankan      html  css  js  c++  java
  • 简单模拟 Promise

    class promise {
      constructor(fn) {
        this.data = null;
        this.err = null;
    
        this.isPromise = false;
    
        this.errFn = null;
        this.queue = [];
    
        this.run = this.run.bind(this);
        this.error = this.error.bind(this);
        this.then = this.then.bind(this);
        this.catch = this.catch.bind(this);
        this.reslove = this.reslove.bind(this);
        this.reject = this.reject.bind(this);
        this.setData = this.setData.bind(this);
        this.getData = this.getData.bind(this);
        this.setQueue = this.setQueue.bind(this);
        this.setErrFn = this.setErrFn.bind(this);
        this.getErrFn = this.getErrFn.bind(this);
        this.setPromise = this.setPromise.bind(this);
        this.getPromise = this.getPromise.bind(this);
    
        fn(this.reslove, this.reject);
    
        return this;
      }
    
      setPromise() {
        this.isPromise = !this.isPromise;
      }
    
      getPromise() {
        return this.isPromise;
      }
    
      setErrFn(fn) {
        this.errFn = fn;
      }
    
      getErrFn() {
        return this.errFn;
      }
    
      setQueue(fn) {
        this.queue.push(fn);
      }
    
      getQueue() {
        return this.queue;
      }
    
      setData(data) {
        this.data = data;
      }
    
      getData() {
        return this.data;
      }
    
      setErr(err) {
        this.err = err;
      }
    
      getErr() {
        return this.err;
      }
    
      reslove(data) {
        if (this.getPromise()) return;
        this.setPromise();
        this.setData(data);
        this.run();
      }
    
      reject(err) {
        if (this.getPromise()) return;
        this.setPromise();
        this.setErr(err);
        this.error();
      }
    
      then(fn) {
        this.setQueue(fn);
        return this;
      }
    
      catch(fn) {
        this.setErrFn(fn);
      }
    
      run() {
        const queue = this.getQueue();
        let ret = this.getData();
        for(let i = 0; i < queue.length; i++) {
          // 下面三种方式都可以实现想要的效果
          process.nextTick(() => {
            ret = queue[i](ret);
          });
          // setImmediate(() => {
          //   ret = queue[i](ret);
          // });
          // setTimeout(() => {
          //   ret = queue[i](ret);
          // }, 0);
        }
      }
    
      error() {
        // 下面三种方式都可以实现想要的效果
        process.nextTick(() => {
          this.setErrFn(fn)
        });
        // setImmediate(() => {
        //   this.setErrFn(fn)
        // });
        // setTimeout(() => {
        //   this.getErrFn()(this.getErr());
        // }, 0);
      }
    
    }
    
    const p = new promise((res, rej) => {
      setTimeout(() => {
        console.log('s1');
        setTimeout(() => {
          console.log('s2');
          setTimeout(() => {
            console.log('s3');
            res('res');
            rej('rej');
            console.log('s4');
          }, 1000);
        }, 1000);
      }, 1000);
    });
    
    let pp = p
    .then((data) => {
      console.log(data);
      return 't2';
    })
    .then((data) => {
      console.log(data);
      return 't3';
    });
    
    pp.then((data) => {
      console.log(data);
    }).catch((err) => {
      console.log(err);
    });

    // 输出
    // s1
    // s2
    // s3
    // s4
    // res
    // t2
    // t3

    上面代码只是简单的进行基础模拟,让回调可以串行化,没有做错误处理、 API 扩展、参数格式化等操作。

     Promise 通过高层次的回调抽离,将代码编写方式从回调改写成了串行,需要在熟练使用的基础上对其内核进行深入的理解才能更加灵活地运用。

  • 相关阅读:
    Mysql问题1862
    S3TC IAP15F2K61S2点亮一个发光二极管keil和stc-isp软件操作
    .NET练习计算平方根
    求一个整数以内的素数(函数实现)
    判断一个数是不是素数(函数实现)
    #号在进制输出值的作用,美化输出
    分类——决策树模型(附有决策树生成步骤)
    分类:贝叶斯分类之新闻组数据组学习(查看数据类型的方法)(环境:Pycharm)
    分类:K-近邻分类之鸢尾花数据集学习(包含数据预处理中的标准化)(环境:Pycharm)
    编写一个程序,求2~n间的素数,n由键盘输入,循环变量分别 从2到n、2到(int)sqrt(n),分别测出两个循环的所用时间。
  • 原文地址:https://www.cnblogs.com/jyuf/p/8566773.html
Copyright © 2011-2022 走看看