改善项目中的耦合

大家好！这篇文章旨在帮助您改进项目数据类型的连接方式，使它们更可靠且更易于理解。

TLDR 对于那些匆忙的人：避免重复引用同一事物的类型和常量，并尝试给它们提供暗示性的名称（即使它们是简单的字符串或数字）。这将使您以后更容易识别、修改或删除您的代码。

---

问题

假设您正在开发一个电子商务网站，并且您已将产品类型定义为：

export type ProductType = {
  id: string;
  name: string;
  price: number;
};

在此类项目中，您可以通过简单的函数轻松找到引用产品 id 的多种方式：

• const getProductById = (产品: ProductType[], id: string) =>; {...};
• const onProductPress = (productId: string) =>; {...};

更高级的情况，例如将产品的数据保存在状态存储中，或将 props 传递给 JS 框架中的其他组件

---

问题

现在让我们用这种方法解决问题：

1. 如果产品的 id 不是这么简单好记怎么办？如果它是类似 ab12-w35-s48-09 （代表例如供应商类别产品变体）怎么办？
2. 如果（这是我的重点）您必须更改整个项目中所有出现的产品 ID 的类型怎么办？ 如果您在不同的文件中引用它时给它不同的名称（例如 ProductId、product_id、pid 或 id），这可能会特别困难。您也不能只搜索字符串，因为您肯定会发现许多与它无关的出现。

---

潜在的解决方案

要解决问题一，您可以使用 模板文字类型，这将使新产品 ID 的类型为：${string}-${string}-${string}-${string}。现在，在多个文件中重复此操作会很烦人，因此可以：

• 为 id 字段创建自定义类型，并在 ProductType 中使用它：

type ProductIdType = `${string}-${string}-${string}-${string}`

如果需要，您还可以为每个字符串创建并引用不同的类型，或者引用您之前创建的其他类型。最后您将使用新类型：

(productId : ProductIdType) => {...}

• 或者你可以参考ProductType的id条目：

(productId : ProductType['id']) => {...}

这两种方法都可以解决问题二：无论您在哪里找到 ProductIdType 或 ProductType['id']，您都会知道您正在处理产品的 id，并且知道您应该替换它。

第一个解决方案可能看起来更友好，但现在您将拥有一个双向结构，其中一个产品类型和另一个 id 类型，可以独立使用。以下是所述结构的示例表示：

这无疑是一个较小的问题，但如果您更改/删除 ProductType 的 id 条目，该更改不会反映在您的整个项目中。

然而，最后一种方法是我通常遵循的方法，因为它增加了数据的耦合（由于缺乏更好的词）。现在，您对产品数据的所有引用都直接指向 ProductType：

---

结论

我并不是说您应该始终为所有数据创建类型。每当我看到自己重复引用相同的数据类型时，我通常会选择访问原始数据类型，就像第二种方法一样。

额外提示 1： 您可以对 const 应用相同的逻辑：如果您发现自己在多个位置重复相同的魔术数字或字符串，最好给它一个正确的指定并使用它。

额外提示 2： 如果您想选择/排除某个类型的多个条目而不是重复它们，请使用“选择”、“省略”和“排除”以及其他实用程序类型。

就这些了！我希望你喜欢我的帖子。请随时留下您对此主题的反馈。

以上是改善项目中的耦合的详细内容。更多信息请关注PHP中文网其他相关文章！