JavaScript笔记之Promise接口封装（deffer）

近期工作需要大量封装 promise 对象异步访问接口，考虑到之前的接口封装过于冗余，在学习了一些项目源码后，结合自己理解编写了适合快速 promise 封装的接口形式。具体代码如下：

1.原先的接口封装

通过返回 promise 对象进行函数返回值的异步封装。

/*
* 这种 `promise` 接口封装方法，优点是结构清晰，缺点是不利用做内部链式调用，通过代码风格较差
*/
function test (_items) {
  return new Promise((resolve, reject) => {
    // 执行具体代码
    if (xxx) {
      resolve(result)
    } else {
      reject(err)
    }
  })
}

2.现有的 deffer 对象构造

通过调用 deffer 函数，实现 promise 对象的同步封装。

/*
* deffer
* 分配函数
*/
function deffer () {
  // 创建新的对象实例
  let deferred = {}

  // 构造 promise 对象
  deferred.promise = new Promise((resolve, reject) => {
    deferred.resolve = resolve
    deferred.reject = reject
  })

  // 返回包含了 promise 的对象
  return deferred
}

3.具体使用

/*
* 在原有方法基础上改造
*/
function test (_items) {
  // 构建 deffer 实例
  let _deffer = deffer()

  // 执行具体代码
  if (xxx) {
    // 释放正确结果
    _deffer.resolve(result)
  } else {
    // 抛出错误
    _deffer.reject(result)
  }

  // 返回 promise 对象，便于用户调用接口
  return _deffer.promise
}

我们可以发现 deffer 函数的优势：

1. 能够在不改变原有 SDK 结构的前提下将接口封装变成 异步;
2. 代码优雅、简洁;
3. 适合将 ES5的 回调接口 快速封装成 ES6以上的 promise 接口方式。

注：示例代码可参见 个人前端知识库。

---

created by @SpiderWang
转载请注明作者及链接