首页 > web前端 > js教程 > 如何将 JavaScript 对象简化为 TypeScript 中的接口属性?

如何将 JavaScript 对象简化为 TypeScript 中的接口属性?

Mary-Kate Olsen
发布: 2024-11-01 01:55:27
原创
774 人浏览过

How to Reduce a JavaScript Object to Interface Properties in TypeScript?

将 JavaScript 对象简化为接口属性

在 TypeScript 中,接口充当数据结构的蓝图。但是,在运行时,接口是空的,因此无法直接将对象简化为仅包含其中定义的属性。

实现

但是,有几种解决方法方法:

使用Class

将接口定义为类:

class MyInterface {
  test: string = undefined;
}
登录后复制

然后,使用 Lodash 提取所需的属性:

import _ from "lodash";

const before = { test: "hello", newTest: "world" };
let reduced = new MyInterface();
_.assign(reduced, _.pick(before, _.keys(reduced)));
console.log("reduced", reduced); // contains only "test" property
登录后复制

Assebly运算符

或者,您也可以使用程序集运算符:

let reduced = {...new MyInterface(), ...test};
登录后复制

这会将空的“MyInterface”对象与“test”对象合并,覆盖任何重复的属性。

为什么使用此方法?

当使用 Angular 的“toJson”方法将数据发送到 REST 服务时,此方法非常有用。 “newTest”属性虽然在编译期间无法访问,但会被“toJson”转换,导致 REST 服务因属性无效而拒绝 JSON。通过将对象简化为接口属性,仅发送预期的数据,确保与服务的正确通信。

以上是如何将 JavaScript 对象简化为 TypeScript 中的接口属性?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板