超越类型安全：通过构建运行时选择器使 TypeScript 更智能

免责声明

嘿，在我们开始之前，让我澄清一下：虽然我会谈论很多关于我的包的内容，ts-runtime-picker，但这不是一篇促销文章。我只是分享我的经验和构建它之前的旅程。 （但是嘿，如果您好奇，这是该包的链接？）。

---

TypeScript 如何让我产生一个新想法（和一个包）

让我们回顾一下。所以，我使用 TypeScript 已经有一段时间了。我不会称自己为 TypeScript 专业人士，但我已经构建了一些大型项目并在我的公司使用它。你知道，常见的一些“hello world”项目，一些稍微复杂的项目，当然，还有相当一部分去谷歌找出“这个错误到底意味着什么？”或“如何再次从界面中选择字段？” （你明白了。？）

有一天，我在使用 Firebase 云函数时遇到了问题。我在 createUser 端点上编写我的验证逻辑、修剪数据并处理常见的 CRUD 请求。一切都进展顺利，直到我遇到了以前的开发人员的这段代码：

firebase.collection("users").add(request.data.user);

...我内心的 TypeScript 专家在尖叫。 ？

我的意思是，来吧，这是一个巨大的危险信号。正确的？像这样直接插入未经过滤的用户数据是有风险的——如果请求数据缺少一些验证并且我们最终将不需要的字段插入到数据库中怎么办？不太好。

我很快删除了代码，但随后我愣了一下。 ？我盯着屏幕思考：“等等，如果我只是将 request.data 分配给用户界面类型，TypeScript 不会阻止我做这样的事情吗？这不是应该解决问题吗？” （充满希望地看了一眼我的 IDE，等待红色波浪线出现。）

但是等等……？‍♂️ TypeScript 不是魔法。这只是编译时检查，对吧？它在运行时不存在。 TypeScript 是类型安全的掩码，但在代码运行时它实际上并不强制执行任何操作。它并没有真正阻止在运行时插入额外的字段。

所以，我打电话给我的一位队友并问道：“嘿兄弟，如果我们有一个名为 Alphabet 的对象，其中包含字母表中的所有字母，并且我们创建一个接口 OnlyTwoLetters，只允许字母 'a' 和 ' b'，当我们将字母表对象投射到该接口时会发生什么？”

// Object with all alphabet letters
const alphabets = {
  a: 'Apple',
  b: 'Banana',
  c: 'Cherry',
  d: 'Date',
  e: 'Eggplant',
  f: 'Fig',
  // ... all the way to z
};

// Interface that only allows 'a' and 'b'
interface OnlyTwoLetters {
  a: string;
  b: string;
}

// Casting alphabets to OnlyTwoLetters
const filteredAlphabets = alphabets as OnlyTwoLetters;

console.log(filteredAlphabets);

我的队友毫不犹豫地说：“哈哈，好吧，你仍然会得到所有字母，因为 TypeScript 无法在运行时真正阻止它。”

该死。我就知道。我满怀希望——希望 TypeScript 能够神奇地防止我在运行时犯错误。 ？

但是随后，我突然想到：如果 TypeScript 可以在运行时强制执行此操作会怎么样？如果我们可以将一个对象转换为特定的接口，并让 TypeScript 自动去除接口中未定义的任何属性，会怎么样？

那可以解决我的问题。

---

ts-runtime-picker 的诞生

所以，在这个灵光乍现的时刻，我想：“为什么不让这成为现实呢？”如果我可以将 request.data 转换为用户界面，TypeScript 可以帮助我自动删除任何额外的属性，使对象可以安全地插入到 Firebase 中。 ？

就这样，ts-runtime-picker 的想法诞生了。目标很简单：创建一个包，允许 TypeScript 用户根据特定接口中定义的字段从对象中过滤掉不需要的属性。

最好的部分？它将使我免于手动验证和过滤字段。那些日子已经一去不复返了：

firebase.collection("users").add(request.data.user);

---

它是如何工作的：让 TypeScript 完成它的工作

使用ts-runtime-picker，整个过程是自动化的。您可以将对象强制转换为接口，并且包将确保仅保留接口中定义的属性。以下是它的实际工作原理：

之前：手动验证

// Object with all alphabet letters
const alphabets = {
  a: 'Apple',
  b: 'Banana',
  c: 'Cherry',
  d: 'Date',
  e: 'Eggplant',
  f: 'Fig',
  // ... all the way to z
};

// Interface that only allows 'a' and 'b'
interface OnlyTwoLetters {
  a: string;
  b: string;
}

// Casting alphabets to OnlyTwoLetters
const filteredAlphabets = alphabets as OnlyTwoLetters;

console.log(filteredAlphabets);

之后：使用 ts-runtime-picker

const filteredData = {
  name: requestData.name,
  age: requestData.age,
};

firebase.collection("users").add(filteredData);  // More work, less fun.

最好的部分？默认情况下，此代码安全。无需手动检查或对象操作。 ts-runtime-picker 通过过滤掉用户界面中不存在的所有字段来自动为您处理它。您可以只专注于核心逻辑，而不必担心意外的字段插入。 ？

---

懒惰的力量（以及它如何带来创新）

所以，您可能会想：“这纯粹是出于懒惰吗？”对此，我说：是的，但也不是。 ?

当然，这个想法最初的火花来自于我有点懒——我不想每次需要插入数据时都手动过滤字段。但是嘿，有时候懒惰会带来辉煌！ 让事情变得更容易的愿望可以成为创新的驱动力。

事实上，尽管最初“懒惰”，我还是花了 8 个小时构建这个包。是的，没错。 ？

但有时就是这样。 “需求催生发明”，这种避免繁琐的重复检查的需求催生了一种新的解决方案，最终使我的生活（希望也是许多其他人的生活）变得更加轻松。

因此，虽然我可以归咎于懒惰，但解决问题的需要才催生了ts-runtime-picker。正因如此，有时陷入困境或懒惰不一定是坏事——它是新的、有用的东西的诞生地！

---

结论

这就是 ts-runtime-picker 包背后的故事。从 TypeScript 受挫到创建解决实际问题的工具的旅程。这个包是我帮助 TypeScript 用户充分利用类型安全的方式——不仅在开发期间，而且在运行时。

如果您厌倦了手动过滤字段或担心不需要的数据潜入，请尝试 ts-runtime-picker。这样就少了一件需要担心的事情，而且它让使用 TypeScript 变得更加智能。 ？

以上是超越类型安全：通过构建运行时选择器使 TypeScript 更智能的详细内容。更多信息请关注PHP中文网其他相关文章！