使用原生JS简单实现ES6中的新特性Promise(一)

Promise是ES6中提供的一种异步编程的解决方案,是一种强大而好用的方法,为解决回调地狱提供了优美的解决办法。

使用方法如下

1 const promise = new Promise((resolve, reject) => {
2       // 这里可以写一个异步程序,可以是一个HTTP请求,也可以是一个其他起步操作
3      if('异步成功') {
4          resolve('返回值')
5      } else {
6          reject('错误信息')
7      }
8 });

现在我们知道了Promise的原理,就可以想一个办法,使用原生JS实现一个简单的Promise方法

function myPromise() {
    this.status = 'pending'; // 定义初始状态为pending;
    this.message = '';
    const resolver = arguments[0]; // 参数应该是一个函数,接受两个参数
    const that  = this;
    resolver(function(){
          that.status = 'fullfilled';  // 将状态更新为已完成
          that.message = arguments[0];  // 
    }, function() {
          that.status = 'rejected';  // 将状态更新为已完成
          that.message = arguments[0];  // 
    });
    return this;
}

接下来就要在myPromise添加原型方法then

myPromise.prototype.then = function() {
        if(this.status === 'fullfilled') {
             argument[0](this.message);
        } else if(this.status === 'rejected') {
             arguments[1](this.message)
        }
}

接下来,写一个实例用来测试

const test = new myPromise(function(resolve, reject){
    resolve('李大师');
});

test.then(function(success)) {
      console.log(success);
}

// 输出李大师

然后,我们为自定义的Promise添加一个catch方法

myPromise.prototype.catch = function(reject) {
     if(this.status === 'rejected') {
          rejected(this.message)
    }
}

写一个实例来测试catch

const test2 = new myPromise(function(resolve, reject) {
    reject('2');
});

test2.catch(error) {
    console.log('出错了' + error)
}

// 输出出错了2

 

posted @ 2019-03-13 23:17  曼施坦因  阅读(792)  评论(0)    收藏  举报