使用条件值定义打字稿接口答案

【问题标题】：Define typescript interface with conditional values使用条件值定义打字稿接口
【发布时间】：2019-06-14 03:40:41
【问题描述】：

假设我想创建一个如下所示的界面：

interface DataStatus<T> {
   isSuccess: boolean; 
   isError: boolean;
   data: T | undefined; 
}

稍后我将像这样使用它：

interface Foo {
   id: string; 
   name: string; 
}

function fetchData() : DataStatus<Foo> {
   //implementation
}


const ds = fetchData(); 

if (ds.isSuccess) {
   console.log(ds.data.name); //TS Warning - ds.data might be undefined
}

我想用这些规则为DataStatus 接口添加一些条件：

isSuccess 和 isError 必须相反
如果isSuccess 为真，data 的值为T，如果isSuccess 为假，则为undefined

打字稿可以做这种事情吗？

【问题讨论】：

标签： typescript

【解决方案1】：

是的，如果你有一个受歧视的工会，你可以。

interface ISuccessDataStatus<T> {
   isSuccess: true; 
   isError: false;
   data: T; 
}

interface IFailureDataStatus<T> {
   isSuccess: false; 
   isError: true;
   data: undefined; 
}


type PossibleStatus<T> = ISuccessDataStatus<T> | IFailureDataStatus<T>;


declare const hello: PossibleStatus<{ name: "john" }>

if (hello.isSuccess) {
    const whatType = hello.data; // T and not T | undefined
}

const whatType = hello; // PossibleDataStatus; (outside the if block)

Typescript 足够聪明，可以判断 hello.isSuccess 何时在它知道为 true 的块内为 true，它会将 hello 的类型缩小到 ISucessDataStatus 而不是 union。

【讨论】：