如何在 TypeScript 中将 JavaScript 对象减少为仅接口属性？

将 JavaScript 对象减少为接口属性

使用 TypeScript 时，我们经常遇到需要将 JavaScript 对象减少为仅包含在一个接口。当将数据发送到需要特定模式的 REST 服务时，这特别有用。

考虑以下接口：

<code class="typescript">interface MyInterface {
  test: string;
}</code>

以及包含附加属性的实现：

<code class="typescript">class MyTest implements MyInterface {
  test: string;
  newTest: string;
}</code>

当我们尝试使用 Angular 的 toJson 方法序列化 MyTest 实例以发送到 REST 服务时，就会出现问题。 toJson 方法包含 newTest 属性，该属性不是接口的一部分。这可能会导致服务器端出现错误。

要解决此问题，我们需要找到一种方法来减少 MyTest 实例，使其仅包含 MyInterface 接口中声明的属性。然而，这是不可能直接实现的，因为 TypeScript 中的接口本质上是没有运行时表示的占位符。

相反，我们可以采用一种解决方法。一种方法是将接口定义为带有属性初始值设定项的类：

<code class="typescript">class MyInterface {
  test: string = undefined;
}</code>

使用此类作为接口，然后我们可以使用 Lodash 等库来仅选择与接口匹配的属性：

<code class="typescript">import _ from 'lodash';

const before = { test: "hello", newTest: "world"};
let reduced = new MyInterface();
_.assign(reduced , _.pick(before, _.keys(reduced)));
console.log('reduced', reduced); // { test: "hello" }</code>

该解决方案有效地减少了 MyTest 实例，使其仅包含 MyInterface 接口中声明的属性，为挑战提供了一个简单实用的解决方案。

以上是如何在 TypeScript 中将 JavaScript 对象减少为仅接口属性？的详细内容。更多信息请关注PHP中文网其他相关文章！