[英]How can I Destructure or optimize the typescript code?
In my typescript class I have skip
function.在我的 typescript class 中,我
skip
了 function。 In my interface
I have mentioned data coming from backend.
在我的
interface
中,我提到data coming from backend.
On the front end
I would like to rename the backend variable
as shown below.在
front end
,我想rename the backend variable
,如下所示。 There are multiple variables, how can I optimize the code
?有多个变量,
how can I optimize the code
?
I thought of using Destructuring concept but not sure how to use.我想过使用解构概念,但不知道如何使用。 I need help
我需要帮助
this.recordId = data?.data1;
this.oldValue = data?.data2;
this.newValue = data?.data3;
............// many more
ts function ts function
skip(rec: ABC) {
const { data1, data2, data3 } = rec;
this.records.skip({ data1, data2, data3}).subscribe(data => {
this.recordId = data?.data1; ---------------------------->Here
this.oldValue = data?.data2; ---------------------------->
this.newValue = data?.data3; ---------------------------->
............// many more
this.processIncomingRecord(data);
});
}
rec.ts建议
export interface ABC {
data1: number;
data2: number;
data3: number;
}
Something like this might help.这样的事情可能会有所帮助。 You can create a secondary "helper" map object (here
MapABCToDEF
) that maps the keys from ABC
to what their frontend key names will be.您可以创建一个辅助“助手” map object(此处
MapABCToDEF
),将键从ABC
映射到它们的前端键名。 Then, you can construct your frontend type (illustrated here as DEF
) by using the " mapped types " feature (TS 4.1 and above).然后,您可以使用“ 映射类型”功能(TS 4.1 及更高版本)构建您的前端类型(此处显示为
DEF
)。
interface ABC {
data1: number;
data2: number;
data3: number;
}
const MapABCToDEF: {[Property in keyof ABC]: string} = {
data1: 'recordId',
data2: 'oldValue',
data3: 'newValue'
}
type DEF = {
[Property in keyof typeof MapABCToDEF as typeof MapABCToDEF[Property]]: ABC[Property];
}
This will help give you better type information is places you might want it.这将帮助您在可能需要的地方提供更好的类型信息。 Ideally though you would just make your data names consistently the same across frontend and backend.
理想情况下,您只需使前端和后端的数据名称一致。 Ie don't use
data1
on the backend and recordId
on the frontend, that will cause unnecessary complexity and confusion.即不要在后端使用
data1
,在前端使用recordId
,这会造成不必要的复杂性和混乱。 Just pick one or the other and standardize it everywhere.只需选择其中一个并将其标准化。
For the renaming itself, the map object MapABCToDEF
can help you streamline the process of assigning key/values to this
in a way that is consistent and type-enforced:对于重命名本身,map object
MapABCToDEF
可以帮助您以一致且类型强制的方式简化分配键/值的this
:
const abc: ABC = {
data1: 100,
data2: 200,
data3: 300
}
// ...
const keys = Object.keys(abc) as Array<keyof typeof abc>;
keys.forEach(eaKey => {
this[MapABCToDEF[eaKey]] = abc[eaKey];
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.