Question

我创建了一个示例代码块，在TypeScript中显示语法错误，但运行良好的JavaScript：TypeScript Sandbox

基本上，当我尝试使用||（OR）运算符来合并可能是undefined TypeScript的对象属性时，它表示该属性不存在，我知道这就是为什么我使用||。

class Person {
    name: string;
    job: string;
}

var person1:Person = {name: 'hi',   job: 'yes'};
var name = 'bye';

function showName(person1:Person | string ) {
    var personsName: string = person1.name || person1;

    document.write(personsName);
    document.write('<br />');
}

showName(person1);
showName(name);

输出完全符合我的预期：

hi
bye

但是，TypeScript在person1.name上显示语法错误。为什么？这样做的正确TypeScript方法是什么？

Answer 1

我建议使用type guard：

function showName(person1: Person | string) {
    var personsName = (typeof person1 === "string") ? person1 : person1.name;

    document.write(personsName);
    document.write('<br />');
}

请注意，当person1为null || undefined时，此代码会引发错误，但原始代码也是如此。有很多不同的方法可以处理，所以我会留给你。

Answer 2

您需要在表达式中断言类型，因为操作数是union类型。即

 var personsName: string = (<Person>person1).name || <string>person1;

错误2339带||和联盟类型

2 个答案: