typescript 在JS中使用析构来组装一个新对象在TS中不能完成-我做错了什么？

bqf10yzr 于 2023-01-14 发布在 TypeScript

关注(0)|答案(2)|浏览(138)

我想使用析构从现有对象创建一个新对象。
在JS中，我执行以下操作：

const objOrig = { a: 1, b:2, c: 3};
const objChanged = { ...({a, c} = objOrig), ...{b:'S'} };
// => objChanged is: { a: 1, b: 'S', c: 3 }

如果我想对TS做同样的处理，我会得到：TS18004：速记属性"a"的范围内不存在值。请声明一个值或提供初始值设定项。

type S = {a: number; b: number| string; c: number};
const objOrig: S = { a: 1, b: 2, c: 3};
const objChanged: S = { ...({a, c} = objOrig), ...{b:'S'} }

如果TS真的是JS的超集，那么它应该是可能的，所以：我做错了什么？
（Playground链接）

typescript

来源：https://stackoverflow.com/questions/75072045/using-destructoring-in-js-to-assemble-a-new-object-could-not-be-done-in-ts-wha

2条答案

按热度按时间

s5a0g9ez1#

JS代码的问题在于它实际上声明了两个全局变量a和c：

const objOrig = { a: 1, b:2, c: 3};
const objChanged = { ...({a, c} = objOrig), ...{b:'S'} };

console.log(a, c);
console.log(objChanged);

打开严格模式，看到它在JavaScript中失败：

"use strict";

const objOrig = { a: 1, b:2, c: 3};
const objChanged = { ...({a, c} = objOrig), ...{b:'S'} };

更改对象的正确方法如下：

const objChanged: S = { ...objOrig, ...{ b:'S' } }

但由于只更改了一个属性，因此可以简化为：

const objChanged: S = { ...objOrig, b:'S' }

Playground

赞(0）回复(0）举报 2023-01-14

z0qdvdin2#

正如vera所说，JS代码很容易被误解。
也许我的例子太简单了，objChanged也应该是一个不同的TS类型。
我能够解决我的问题如下。

// TS-code 
    type S1 = { a: number; b: number; c: number };
    type S2 = { a: number; b: string; c: number };

    const origObj: S1 = { a: 1, b: 2, c: 3 };
    let a: S1['a'];
    let c: S1['c'];
    const otherObj: S2 = { ...(({ a, c } = origObj), { a, c }), ...{ b: 'S2' } };

    console.log(`origObj: ${JSON.stringify(origObj)}\notherObj: ${JSON.stringify(otherObj)}`);

再次感谢您的回复。

赞(0）回复(0）举报 2023-01-14

我来回答

typescript 在JS中使用析构来组装一个新对象在TS中不能完成-我做错了什么？

2条答案

相关问题

热门标签

最新问答