为什么 TypeScript 不能推断相同对象类型的赋值？

Question

Let's say I have this very simplified example of what's happening in my code:

interface I {
  n?: number;
  s?: string;
}

const a: I = {
  n: 1,
}

const b: I = {
  n: 2,
  s: 'b',
}

const props = ['n', 's'] as const;

for (const prop of props) {
  if (!a[prop]) {
    // here, I get the following error:
    // TS2322: Type 'string | number' is not assignable to type 'never'.
    //   Type 'string' is not assignable to type 'never'.
    a[prop] = b[prop];
  }
}

Being a and b the same types, accessing the same property prop ... shouldn't it be possible?

• If b[prop] is a number, then a[prop] should accept numbers
• If b[prop] is a string, then a[prop] should accept strings
• If b[prop] is undefined, is because that prop is optional ?

So, what am I missing here?

Update: Since I simplified my example too much, the answer was to remove the as const part... But I think it's due to my environment, because I'm using strict: true in tsconfig.json ...

then, if I try accessing without as const , I get this the TS7053 error:

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'I'.

No index signature with a parameter of type 'string' was found on type 'I'.

Fix adding the as const or doing for(const prop of props as ('n' | 's')[]) {

and then is when I get my original error (which can be easily fixed with as any but I'm trying to avoid that)

Answer 1

In general, Typescript doesn't prove every provable property of your code, and isn't trying to. In this particular case, we humans know that the type of b[prop] matches the type of a[prop] because the property names are the same, but Typescript doesn't see that because it doesn't have a rule which would allow it to.

If we follow Typescript's logic:

• props is declared as a tuple of type ['n', 's'] .
• prop is declared as an element of props , so its type is inferred as 'n' | 's' 'n' | 's' .
• Since b is declared as type I , then b[prop] is then inferred as type I['n' | 's'] I['n' | 's'] which simplifies to string | number string | number .
• Since a is declared as type I , then the assignment target a[prop] can only receive a value which is assignable to any property that prop might name; so the assignment target's type is inferred as I['n'] & I['s'] which simplifies to string & number , and then never .
• So as far as Typescript is concerned, the assignment a[prop] = b[prop] is assigning a value of type string | number string | number to an assignment target of type never . Since string | number string | number is not assignable to never , this is a type error.

The simplest fix is to use a type assertion like b[prop] as any , ie you tell Typescript that you know your code is type-safe so it doesn't need to be checked. Another option is to use a helper function which does the assignments in a way that satisfies Typescript's type-checker:

function copyMissingProperties<T>(a: T, b: T, props: readonly (keyof T)[]): void {
    for (const prop of props) {
        if (!a[prop]) {
            a[prop] = b[prop]; // ok
        }
    }
}

Here, prop 's type is keyof T which is not a union type, so the assignment target doesn't have an intersection type.

Answer 2

Here is one way I got it to work without making use of casting:

interface I {
    n?: number;
    s?: string;
}

const a: I = {
    n: 1,
}

const b: I = {
    n: 2,
    s: 'b',
}

const props: Array<keyof I> = ['n', 's'];

for (const prop of props) {
    if (!a[prop]) {
        const newProp: I = {[prop]: b[prop]};
        Object.assign(a, newProp);
    }
}

The trick was to use Object.assign. However, to still ensure the type safety, you can declare the new property as an object of type I and then use it in the Object.assign. To make this work in all cases, the best way to do is to just do Object.assign(a, {[prop]: b[prop]})

Answer 3

the problem is with this line

const props = ['n', 's'] as const;

change it to

const props = ['n', 's'];

check this stackblitz

Answer 4

I tried like that and its work, and you should remove as const value on props definition

interface I {
  n?: number;
  s?: string;
}

const a: I = {
  n: 1,
}

const b: I = {
  n: 2,
  s: 'b',
}

const props = ['n', 's'];

for (const prop of props) {
  if (!a[prop]) {
    a[prop] = b[prop];
    console.log(a, b);
  }
}

Result is: {n: 1, s: "b"} {n: 2, s: "b"}