javascript - typescript 介意对象文字中实例化的顺序吗？

Question

我使用的是最新的 Typescript 版本:2.6.2。

我遇到了一个奇怪的情况，如果我执行 foo({a:1,b:2}) - 事情不起作用，而如果我执行:foo({ b:2,a:1}) - 它们确实有效。

我有一个通用类，一个具有 2 个属性和一个函数的接口(interface)。

代码如下:

class MyClass<T>  {
    value: T;
    next(value: T): void {
  }
}


export enum StateKey { backlogItems='backlogItems'}


export interface State {
    backlogItems : number[];
    [key: string]: any
}

class A {

    private subj = new MyClass<State>();

    public set<T>(name: StateKey, state: T) {
        this.subj.next({  backlogItems: [...this.subj.value.backlogItems] ,
                         [name]:state      //<--- error here
                       })        
    }    
}

我得到一个错误:

 Argument of type '{ [name]: T; }' is not assignable to parameter of
 type 'State'.   Types of property 'backlogItems' are incompatible.
     Type 'T' is not assignable to type 'number[]'.

但是如果我改变对象中文字的顺序:

来自:

this.subj.next({ backlogItems: [...this.subj.value.backlogItems], [name]: state })

到:

 this.subj.next({ [name]:state, backlogItems: [...this.subj.value.backlogItems] })

• 那就没有错误了

问题

为什么改变顺序可以编译？

Image proof

Typescript play ground demo

Answer 1

如果您将 StateKey 枚举中的字符串更改为其他值，它会编译而不会出错，如下所示

export enum StateKey { backlogItems='somethingElse'}

(如果您向枚举添加更多值，错误也会消失)

编译器正在做 type inference并检测到 next() 函数参数中的 [name] 只能是 backlogItems，声明为 number[] 。

所以对象字面量的两种变体都为同一个属性分配了两个不同的值，这就是分配顺序很重要的原因——基本上，最后一个获胜。如果最后分配的值与声明的属性类型不兼容，编译器会报告错误 - T 与 number[] 不兼容。

更新

此外，为了保留代码并消除错误，您可以让编译器忘记它为 name 推断的类型，方法是将它分配给带有 string< 的中间变量 类型:

class MyClass<T>  {
    value: T;
    next(value: T): void {
  }
}


export enum StateKey { backlogItems='backlogItems'}


export interface State {
    backlogItems : number[];
    [key: string]: any
}

class A {

    private subj = new MyClass<State>();

    public set<T>(name: StateKey, state: T) {
        const key: string = name;
        this.subj.next({  backlogItems: [...this.subj.value.backlogItems] ,
                         [key]:state     
                       })        
    }    
}