如何将静态/常量值简单地分组到一个“命名空间”中

Question

想象一下，您想将应用程序的所有端点URL放入一个文件中。总体目标是能够像这样使用这些URL：

import { Endpoints } from "./Endpoints";

Endpoints.APP_BASE_URL
Endpoints.ORDER
Endpoints.BOOKS

只需一个名为import 即可访问所有端点URL。另外，URL之间是彼此依赖的（下面将更加清楚），这就是enum不够的原因。

选项1：抽象类

export abstract class Endpoints {
  public static APP_BASE_URL = "http://localhost:7777/";
  public static BOOKS = `${Endpoints.APP_BASE_URL}books/`;
  public static ORDERS = `${Endpoints.APP_BASE_URL}orders/`;
}

缺点：滥用class。

选项2：分组导出

const APP_BASE_URL = "http://localhost:7777/";
const BOOKS = `${APP_BASE_URL}books/`;
const ORDERS = `${APP_BASE_URL}orders/`;

export const Endpoints = { APP_BASE_URL, BOOKS, ORDERS };

缺点： 容易出错和重复，因为您总是必须两次编写端点。

选项3：索引文件

export const APP_BASE_URL = "http://localhost:7777/";
export const BOOKS = `${APP_BASE_URL}books/`;
export const ORDERS = `${APP_BASE_URL}orders/`;

// index.ts/js
import * as Endpoints from "./Endpoints";

export { Endpoints };

缺点：：一个简单问题的额外文件。

问题

除了上面提到的3个选项之外，还有另一种对静态/常量值进行分组的方法，理想情况下没有缺点吗？
如果没有其他选择，哪个是 javascripty / typescripty 最多？

（请不要关注端点示例，也可以是数字，对象或其他任何东西）

Answer 1

我建议以下文档页面： -https://www.typescriptlang.org/docs/handbook/namespaces-and-modules.html

您可以从首页添加另一个选项： 使用namespace关键字。但是，由于您正在使用本机模块，因此这样做没有任何意义，正如文档中也提到的那样-请参阅“无需命名空间”部分。 并且它还为您解决了您的问题提供了正确的解决方案，您也曾碰过，但是由于某种原因添加了额外的文件：

import * as Endpoints from "./Endpoints";

文档摘录：

  

TypeScript中模块的主要功能是两个不同的模块   绝不会在相同范围内提供名称。因为消费者   由模块决定要为其分配的名称，因此无需   主动将导出的符号包装在名称空间中。

     

要重申为什么不应该为模块内容命名空间，   名称空间的一般想法是提供以下内容的逻辑分组   构造并防止名称冲突。因为模块文件   本身已经是一个逻辑分组，它的顶级名称是   由导入它的代码定义，因此无需使用   导出对象的附加模块层。