打字稿分配链接答案

【问题标题】：Typescript assignment chaining打字稿分配链接
【发布时间】：2022-12-20 09:59:37
【问题描述】：

let a: {
    m?: string
};

let b = a = {};

b.m = ''; // Property 'm' does not exist on type '{}'.


let a: {
    m?: string
} = {};

let b = a;

b.m = ''; // It's OK

Playground link

使用赋值链时发生了什么？如何解决此类型错误？

【问题讨论】：

标签： javascript typescript variable-assignment

【解决方案1】：

让我们从第一种情况开始：

let a: {
  m?: string
};

let b = a = {};

b的类型不是从a推断出来的，而是从{}推断出来的，这就是为什么你不能从b访问m的原因。

在第二种情况下

let a: {
    m?: string
} = {};

let b = a;

b 的类型是从具有 m 属性的 a 推断出来的。

为什么这个？

举下面的例子

let x = y = z;

y = z 结果为 z，这是因为赋值实际上是一个表达式。

所以打字稿检查z的类型（在我们的例子中是{}）并将它分配给x（在我们的例子中是b）

为了解决第一种情况，您必须将a 和b 声明为{ m?: string }。

type Foo = {
    m?: string;
}

let a: Foo;

let b: Foo = a = {}

游乐场link

【讨论】：

【解决方案2】：

使用赋值链，b 变量获得{} 的值但没有获得a 的类型。

您需要单独创建 type 并将其应用于 b 变量。

type A = {
    m?: string;
}

let a: A

let b: A = a = {};


b.m = '';

PLAYGROUND LINK

【讨论】：

【解决方案3】：

可以链接赋值运算符，以便将单个值分配给多个变量 (link)。所以，赋值let b = a = {};和命令序列let b = {}; a = {}是一样的，在这种情况下，你可以看到a从来没有赋值给b，您可以使用下面的代码来获得预期的结果：

    let a: {
      m?: string
    };
    let b = a;
    b = a = {};

【讨论】：