Typescript - 如何基于可选布尔参数和默认值执行条件返回类型

Question

我正在将一些现有的 JS 代码转换为 TS，我们使用了一种我无法弄清楚如何用 typescript 正确表达的模式：

function getVehicles({
    brandFields = false,
    ownerFields = false,
    maintenanceFields = false
} = {}) {
    // building and executing some SQL
}

我们的存储库严重依赖这种模式，我们将获取成本高昂的数据放在一个标志后面，一个函数可以有多个这样的标志。

现在，尝试键入返回值的不同部分有点麻烦，但效果很好：

type Vehicle = { id: dbId, manufactureDate: Date, color: string }
type VehicleBrand = { brandName: string, brandCountry: string }
type VehicleOwner = { owner: Person }
type VehicleMaintenance = { maintenance: { date: Date, place: string, operation: string } [} }

function getVehicles({
    brandFields = false,
    ownerFields = false,
    maintenanceFields = false
} = {}): (Vehicle & VehicleBrand & VehicleOwner & VehicleMaintenance) [] {
    // building and executing some SQL
}

但我想让返回类型更精确。 This SO question 建议进行重载，但由于排列的数量，在这种情况下并不实用。

所以我认为留给我的唯一选择是使用泛型和条件类型，类似于：

// With only one parameter for simplicity
function getVehicles<
    Brand extends boolean
>({
    brandFields: Brand = false
} = {}): (
    Vehicle &
    (Brand extends true ? VehicleBrand : {})
) [] {
    // building and executing some SQL
}

但我还没有找到一种方法来让 typescript 在所有情况下都返回最窄的类型。

getVehicles()                         // should return Vehicle
getVehicles({ brandFields: false })   // should return Vehicle
getVehicles({ brandFields: true })    // should return Vehicle & VehicleBrand
getVehicles({ brandFields: boolean }) // should return Vehicle & (VehicleBrand | {})

我最接近的是这个签名，但它太松散了：

function getVehicles<
    Brand extends boolean
>({
    brandFields: Brand | false = false // <-- union to avoid an error ...
} = {}): (
    Vehicle &
    (Brand extends true ? VehicleBrand : {})
) [] {
    // building and executing some SQL
}

getVehicles({ brandFields: true }) // but returns Vehicle & (VehicleBrand | {}) in this case

在当前打字稿的限制下，这甚至可以实现吗？

Answer 1

您可以使用conditional types 实现此目的，如下所示：

type Vehicle<O extends OptionsFlags> = VehicleBase &
  (O extends { brandFields: true }
    ? VehicleBrand
    : O extends { brandFields: false | undefined }
    ? {}
    : VehicleBrand | {}) &
  (O extends { ownerFields: true }
    ? VehicleOwner
    : O extends { ownerFields: false | undefined }
    ? {}
    : VehicleOwner | {}) &
  (O extends { maintenanceFields: true }
    ? VehicleMaintenance
    : O extends { maintenanceFields: false | undefined }
    ? {}
    : VehicleMaintenance | {});

interface OptionsFlags {
  brandFields?: boolean;
  ownerFields?: boolean;
  maintenanceFields?: boolean;
}

interface VehicleBase {
  id: dbId;
  manufactureDate: Date;
  color: string;
}
interface VehicleBrand {
  brandName: string;
  brandCountry: string;
}
interface VehicleOwner {
  owner: Person;
}
interface VehicleMaintenance {
  maintenance: { date: Date; place: string; operation: string }[];
}

function getVehicles<O extends OptionsFlags>({
  brandFields = false,
  ownerFields = false,
  maintenanceFields = false,
}: O = {} as O): Vehicle<O>[] {
  // ...
}

getVehicles({ brandFields: true }) // return type is Vehicle<{ brandFields: true }>[]

但是...

根据您的使用方式，您可能会发现像这样定义 Vehicle 类型更有帮助，这允许每个 Vehicle 子类型解析为可能具有可选属性的单个接口：

type Vehicle<O extends OptionsFlags> = VehicleBase &
  (O extends { brandFields: true }
    ? VehicleBrand
    : O extends { brandFields: false | undefined }
    ? {}
    : Partial<VehicleBrand>) &
  (O extends { ownerFields: true }
    ? VehicleOwner
    : O extends { ownerFields: false | undefined }
    ? {}
    : Partial<VehicleOwner>) &
  (O extends { maintenanceFields: true }
    ? VehicleMaintenance
    : O extends { maintenanceFields: false | undefined }
    ? {}
    : Partial<VehicleMaintenance>);

Vehicle<{ brandFields: boolean }> 将等同于：

{
  id: dbId;
  manufactureDate: Date;
  color: string;
  brandName?: string;
  brandCountry?: string;
}