[聚合文章] 对Promise增加统一操作扩展

JavaScript 2018-01-06 26 阅读

在ES6里,增加了 Promise 方法。而 Promise 的回调函数只有 thencatch 两种方法。

而后,Promise又添加了两种附加方法,当然需要自己去添加进去。

可以去看一下上文的链接去了解一下,或者去下面的链接,看下官方源码是如何实现的: donefinally

正文

但是却没有一个针对 thencatch 的统一操作。

如果在最后处理的时候, thencatch 的代码处理逻辑差不多的情况下,可能就需要写两份差不多的代码量。

当然可能会有些人会把差不多的代码处理逻辑提取到一个函数里,但是这样也不太美观,这个时候如果有一个回调函数可以同时处理 resolvereject 就好了。

我们可以对 Promise 方法添加一个原型函数。这个函数来捕获 resolvereject ,然后进行处理返回,就好了。代码很简单,如下:

Promise.prototype.unified = function (callback){
  this.then(
    data => callback(true, data),
    data => callback(false, data)
  )
}

使用的方法也很简单,我们先写一个没有 统一操作 的Promise代码:

let promise = new Promise(function(resolve, reject){
  if (false){
    setTimeout(()=> resolve('success'), 1000)
  } else {
    setTimeout(()=> reject('error'), 1000)
  }
})

promise
  .then((data) => {
    console.log(
      state: true,
      data: data,
      msg: 'operation successful'
    )
  })
  .catch((data) => {
    console.log(
      state: false,
      data: data,
      msg: 'operation failed'
    )
  })

然后我们使用 unified 方法重写一个:

let promise = new Promise(function(resolve, reject){
  if (false){
    setTimeout(()=> resolve('success'), 1000)
  } else {
    setTimeout(()=> reject('error'), 1000)
  }
})

promise.unified((state, data) => {
  const msg = state ? 'operation successful' : 'operation failed'
  console.log(
    state,
    data,
    msg
  )
})

是不是方法了很多,当然此方法属于代码耦合了。也请谨慎使用,不然后期维护会很麻烦。

注:本文内容来自互联网,旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜,请你联系站长进行处理。