Question

我正在编写一个客户端以使用JavaScript与服务器API进行通信。我有OOP背景，但是正在尝试使用现代EcmaScript。

所以我从这里开始：

customerApi.js：

const baseUrl = "http://myapi";
export const getCustomers = () => { /* get customer code */ }
export const addCustomer = cust => {}
export const deleteCustomer = id => {}

所有功能都使用baseUrl。

现在我想重构，以便使用customerApi.js的代码在baseUrl中设置/传递，而我想出的唯一方法是-

将其设为类：

export default class customerApi {
  constructor(baseUrl) {
   this._baseUrl  baseUrl;
  }
}

将其传递给每种方法：

export const getCustomers = (baseUrl) => { /* get customer code */ }
export const addCustomer = (baseUrl,cust) => {}
export const deleteCustomer = (baseUrl,id) => {}

包装函数：

const moduleFn = baseUrl => (
  return {
    getCustomers: () => { /* get customer code */ }
    addCustomer: (cust) => {}
    deleteCustomer: (id) => {}
  }
)
export default moduleFn;

这些只是示例。在模块上实现“可设置”变量的最常见模式是什么？

Answer 1

我会采用函数方法

export default function(baseUrl){

  return Object.freeze({
    getCustomers: () => { /* get customer code */ }
    addCustomer: (cust) => {}
    deleteCustomer: (id) => {}
  })

}

这是因为所有函数的baseUrl都已关闭，并且不需要额外的工作。

客户代码可以简单

import yourmodule from 'yourmodule';
var derp = yourmodule('www.derp.com')

实现可设置模块范围变量的最常见模式

1 个答案: