[2

嘿，在开始之前，让我澄清一下：虽然我会谈论我的软件包，但

ts-runtime-picker

，这不是促销文章。我只是在分享自己的经验以及在构建之前所经历的旅程。 （，但是嘿，如果您很好奇，这是指向软件包的链接？）。

typescript如何使我成为一个新的想法（和一个软件包） 让我们倒回去。因此，我已经使用TypeScript了一段时间了。我不会称自己为打字稿专业人士，但是我已经建立了一些大型项目，并在我的公司中使用了它。您知道，通常的“ Hello World”项目，一些更复杂的项目，当然，还有相当多的Google旅行来弄清楚“这个错误意味着什么？”或“如何再次从接口中挑选字段？” （您明白了。？）

有一天，我在使用Firebase Cloud功能时遇到了一个问题。我在

---

createuser

端点上，编写我的验证逻辑，修剪数据并处理常规的crud请求疯狂。一切都流畅地移动，直到我从以前的开发人员那里遇到这一代码：

...我的内部打字稿Pro在尖叫。 ？

我的意思是，这是一个巨大的危险信号。正确的？直接插入未经过滤的用户数据是有风险的 - 如果请求数据缺少某些验证，我们最终将不需要的字段插入数据库中？不好。
我迅速删除了代码，但是，我冻结了一秒钟。 ？我盯着屏幕思考：“坚持不懈，如果我只是将请求分配给用户界面类型，那么打字稿会阻止我做这样的事情吗？这是否解决问题吗？” （提示我的IDE有希望的一眼，等待红色的线条出现。）

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

魔术。这只是一张编译时间检查，对吗？它在运行时不存在。 Typescript是用于类型安全的掩码，但是当代码运行时，它实际上并没有强制执行任何操作。它不是

阻止在运行时插入额外的字段。

因此，我打电话给我的一个队友，问：“嘿，如果我们有一个名为字母的对象，并在字母内使用所有字母，并且创建一个只允许字母'a''''和'b'的界面，当我们将字母施放到该界面时会发生什么？ //对所有字母字母的对象 const alphabets = { 答：“苹果”， B：“香蕉”， C：“樱桃”， D：“日期”， E：“茄子”， F：“无花果”， // ...一直到Z }; //仅允许“ A”和“ B”的接口 唯一接口twoletters { 答：字符串； B：字符串； } //将字母施放到只有woletters const FilledAlphabets = Alphabets仅为woletters; console.log（filledalphabets）;

没有错过任何节奏，我的队友说：“哈哈，好吧，您仍然会收到所有字母字母，因为Typescript无法真正在运行时停止。”

该死。我就知道。我正受希望的效果 -

，Typescript可以神奇地阻止我在运行时犯错误。 ？ ，但是，它打了我：如果打字稿可以在运行时执行此操作怎么办？如果我们可以将对象施放到特定的接口并使Typescript 自动剥离接口中未定义的任何属性怎么办？

可以解决我的问题。

// 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的诞生

因此，在这个灯泡的时刻，我想：“为什么不将其实现呢？”如果我可以将请求施放到用户界面，那么TypeScript可以自动帮助我删除任何额外的属性，从而使对象安全地插入firebase中。 ？

和那样，

ts-runtime-picker 的想法是诞生的。目标很简单：创建一个软件包，该软件包可以根据特定接口中定义的字段来滤除对象的不需要属性。 最好的部分？这将使我免于手动验证和过滤字段的过滤。几天已经一去不复返了：

const filleddata = { 名称：requestData.name， 年龄：requestData.age， }; firebase.Collection（“用户”）。add（FilledData）; //更多的工作，更有趣。

---

的工作方式：让打字稿完成其作业

ts-runtime-picker

，整个过程都是自动化的。您可以将对象施放到接口，并且软件包将确保仅保留接口中定义的属性。这是它在行动中的工作方式：

之前：手动验证

接口用户{ 名称：字符串; 年龄：数字； } const requestData = {名称：'John'，年龄：30，地址：'123 Street'}; //手动检查并删除不需要的字段： const FilterData = { 名称：requestData.name， 年龄：requestData.age， }; firebase.Collection（'用户'）。add（FilledData）; //不是很优雅。

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

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

---

最好的部分？此代码默认情况下是

。无需手动检查或对象操纵。 TS-runtime-picker通过过滤用户界面中不存在的所有字段来自动为您处理它。您只需关注核心逻辑而不担心意外插入。 ？

的懒惰力量（以及它如何导致创新）

因此，您可能想知道：“这是纯粹的懒惰吗？”为此，我说：

的渴望使事情变得更容易可能是创新的推动力。 实际上，尽管最初的“懒惰”，但我花了8个小时

构建软件包。是的，是的。 ？

// 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

。有时，

import { pick } from 'ts-runtime-picker';

interface User {
  name: string;
  age: number;
}

const requestData = { name: 'John', age: 30, address: '123 Street' };

// Automatically filters out non-existent properties:
const safeData = pick(requestData, User);

firebase.collection('users').add(safeData);  // Much cleaner!

结论

---

，这就是 ts-runtime-picker package的故事。从打字稿挫败到创建解决真正问题的工具的旅程。该软件包是我帮助打字稿用户充分利用类型安全的方式 - 不仅在开发期间，而且在运行时。

如果您厌倦了手动过滤字段或担心不需要的数据潜入，请给出

ts-runtime-picker 。这是不必担心的一件事，它使使用Typescript的工作越聪明。 ？