Question

class TestComponent extends Component {
    static defaultprops = {
        food: ["goatmeat", "yam"]
    }

    render() {
        let categories = this.props.defaultprops.food.map(foods => {
            return <option key={foods}>{foods}</option>
        });

        let {test} = this.props;

        return (
            <p>
                {this.props.test}
            </p>
        );
    };
}

我有一个名为foo的函数，该函数接受bar的一个参数，该参数的类型为MyType。 MyType的某些实例未定义type MyType = { name: string, content: string | undefined } function doThing(baz: string) {...} function foo(bar: MyType) { if(bar.name === "goodName") { doThing(bar.content) //Error } }属性，但是我知道一个事实，其中content的实例确实具有其bar.name === "goodName"属性。但是，TypeScript不知道这一点，并在上面的代码中引发错误。如何以这种方式表示bar.content是TypeScript的字符串：

content

TypeScript中是否存在这样的功能？我知道用户定义的函数类型防护，但是我想知道在这样的特定情况下是否有一种更简单的方法（只需在if(bar.name === "goodName") { bar.content is string; //Hypothetical doThing(bar.content); //No error; the desired outcome }中使用）。

Answer 1

如果name的选项数量有限，则可以使用有区别的联合：

type MyTypeBadName = {
  name: 'badName',
}
type MyTypeGoodName = {
  name: 'goodName',
  content: string
}

function doThing(baz: string) {}

function foo(bar: MyTypeBadName | MyTypeGoodName) {
  if(bar.name === "goodName") {
    doThing(bar.content) //ok
  }
}

否则，您可以使用自定义类型防护来更改栏的类型：

type MyType = {
  name: string,
  content: string | undefined
}


type MyTypeGoodName = {
  name: 'goodName',
  content: string
}

function isGoodName(baz: MyType): baz is MyTypeGoodName {
  return baz.name == "goodName"
}
function doThing(s: string) { }

function foo(bar: MyType) {
  if(isGoodName(bar)) {
    doThing(bar.content) //ok
  }
}

Answer 2

您是否为可选属性尝试了类似的方法，或者这不适合您的情况：

type MyType = {
  name: string,
  content?: string
}

function doThing(baz: string) {...}

function foo(bar: MyType) {
  if(bar.name === "goodName") {
    doThing(bar.content) //Error
  }
}

Answer 3

使用non-null assertion operator !。从文档中：

一个新的！在类型检查器无法得出结论的情况下，可以使用后缀表达式运算符来断言其操作数是非null且未定义的。具体来说，就是操作x！产生x类型的值，其中排除了null和undefined。

我认为这正是您的用例。

function foo(bar: MyType) {
  if(bar.name === "goodName") {
    doThing(bar!.content) // Let the compiler know content will always be defined
  }
}

TypeScript内联静态类型防护

3 个答案: