数组元素上不存在属性

Question

我正在尝试返回一个包含初始化对象和数字的数组。

但是我得到以下错误：

类型 'number | 上不存在属性 'foo' IObj' 属性 'foo' 类型“数字”上不存在

interface IObj {
    [k: string]: string
}

function test(fields: string[]){
    const foo: IObj = {}
    fields.forEach((x) => foo[x] = 'baz')
    return [foo, 1]   
}
const [foo, x] = test(['foo'])
foo.foo

我该如何解决这个问题？

Answer 1

默认情况下，对于数组字面量，typescript 会推断出一个数组，因此当发生解构时，每个元素都是IObj | number，第一个元素是IObj，第二个元素是数字的信息将会丢失。

在最近发布的 3.4 中，您可以使用 as const 让编译器推断出只读元组 (return [foo, 1] as const)

或者你可以使用显式类型注释告诉编译器你想要一个元组：

interface IObj {
    [k: string]: string
}

function test(fields: string[]) : [IObj, number]{
    const foo: IObj = {}
    fields.forEach((x) => foo[x] = 'baz')
    return [foo, 1]  
}
const [foo, x] = test(['foo'])
foo.foo

如果您打算为 fields 参数使用常量，我是否可以建议您的代码使用更安全的版本：

function test<K extends string>(fields: K[]) : [Record<K, string>, number]{
    const foo = {} as Record<K, string>
    fields.forEach((x) => foo[x] = 'baz')
    return [foo, 1]  
}
const [foo, x] = test(['foo'])
foo.foo //ok
foo.foo2 // err