有效javascript上的Typescript错误

Question

我正在尝试在打字稿中执行以下操作:

var testHier = [
    { content:"1", opened:true, children: [
        { content:"1.1" }
    ]},
    { content: "2", opened:true, children: [
        { content:"2.1", opened:false, children: [
            { content:"2.1.1", value:"2.1.1" }
        ]},
        { content: "2.2", value: "2.2" }
    ]}
]

但是当我编译时,我得到了错误:

"数组文字表达式中不兼容的类型:输入'{content:string; opened:bool; children:{content:string; value:string;} [];}'缺少属性'value',类型为'{content:string; value:string;}'"

如果我改变

{ content:"2.1", opened:false, children: [

至

{ content:"2.1", opened:false, value:"foo", children: [

错误消失了.

我在chrome控制台中测试了声明,它似乎工作得很好.由于这只是javascript,我希望它直接通过,但似乎并非如此.谁知道这里发生了什么？

Answer 1

您只需要提供一些类型信息即可:

interface IExample {
    content: string;
    opened?: bool;
    value?: string;
    children?: IExample[];
}

var testHier: IExample[] = [
{ 
    content:"1", 
    opened:true, 
    children: [
        { 
            content:"1.1" 
        }
    ]
},
{
    content: "2", 
    opened:true, 
    children: [
        { 
            content:"2.1", 
            opened:false, 
            children: [
                { 
                    content:"2.1.1", 
                    value:"2.1.1"
                }
            ]
        },
        { 
            content: "2.2", 
            value: "2.2" 
        }
    ]
}];

它试图弄清楚数组的每个部分中的类型是什么,并且无法提出猜测所需的通用性 - 在数组中它需要所有类型都相同(即所有字符串或所有数字,但是不是混合物!).IExample接口通过指定any类型来帮助.

为什么TypeScript会这样做？

TypeScript想帮助你.如果它可以为你推断一个类型,为了节省你必须明确声明它,它会.总的来说这是有益的 - 它将检测以下脚本中的错误:

var x = [
    10,
    20,
    "30",
    50
];

在这种情况下,它会推断您有一个数字数组,警告您那里有一个字符串.如果使用它any而不是巧妙地计算出类型,你就不会得到这种帮助.

您仍然可以通过告诉x类型any[]错误消失的TypeScript来决定是否要拥有混合数组.

最好是TypeScript通过在出现错误时警告您不兼容的类型来启动 - 例如在您的情况下您可能忘记添加opened和删除value每个对象 - 因此TypeScript可以帮助您避免错误.