在仍能推断类型的同时，能否在此函数中获得TypeScript自动完成功能？

Question

我正在编写一组工厂函数，每个工厂函数都将返回较大整体对象的一部分。 由于它是一种复杂的类型，因此我希望能够使用智能感知来帮助我编写这些功能。

我不知道使用什么返回类型来注释函数，以确保获得智能/自动完成功能。 到目前为止，我已经尝试了三件事。 对于这些示例，可以假设FooType定义为：

interface FooType {
    prop1: boolean;
    prop2: boolean;
    ...
}

选项一

我可以使用类型推断来自动确定函数的类型，但是这样我就不会得到任何类型推断。

function PartialFooMaker1() {
   return {
        prop1: true,
        // I want autocomplete in here
   }
}
function PartialFooMaker2() {
   return {
        prop2: true,
        // I also want autocomplete in here
   }
}

export const Foo: FooType = Object.assign({}, PartialFooMaker1(),PartialFooMaker2());

选项二

我可以将完整类型指定为函数返回类型，但是如果我省略一些属性，那会（正确）触发编译错误。

function PartialFooMaker1(): FooType {
   return {
        prop1: true,
        // I have autocomplete, but TS complains about the lack of prop2
   }
}
function PartialFooMaker2(): FooType {
   return {
        prop2: true,
        // I have autocomplete, but TS complains about the lack of prop1
   }
}

export const Foo: FooType = Object.assign({}, PartialFooMaker1(),PartialFooMaker2());

选项三

我可以将完整类型指定为函数返回类型，但是如果我省略一些属性，那会（正确）触发编译错误。

function PartialFooMaker1(): Partial<FooType> {
   return {
        prop1: true,
        // I have autocomplete! :)
   }
}
function PartialFooMaker2(): Partial<FooType> {
   return {
        prop2: true,
        // I have autocomplete! :)
   }
}

// the compile error is now here - TS doesn't know that prop1 and prop2 are present
export const Foo: FooType = Object.assign({}, PartialFooMaker1(),PartialFooMaker2());

我还考虑过将FooType拆分为定义明确的子类型，然后与并集类型重新组合，但实际上，它是一个复杂的派生类型，因此对我来说很难拆分。

还有什么我可以尝试的吗？

Answer 1

如果可以（合理地）使用Pick ：

interface NamePart { first: string; last: string }
interface AgePart  { age: number; }
interface FooType extends NamePart, AgePart
{
    oneMoreThing: string;
}

function PartialFooMaker1(): Pick<FooType, keyof NamePart | "oneMoreThing">
{
    return {
        first: "Steve",
        last: "Stevenson",
        oneMoreThing: "!",
    }
}
function PartialFooMaker2(): Pick<FooType, keyof AgePart>
{
    return {
        age: 42
    }
}

export const Foo: FooType = { ...PartialFooMaker1(), ...PartialFooMaker2() };

第一部分的解析类型为Pick<FooType, "first" | "last" | "oneMoreThing"> Pick<FooType, "first" | "last" | "oneMoreThing"> Pick<FooType, "first" | "last" | "oneMoreThing">与Pick<FooType, "age">正确Pick<FooType, "age">形成FooType的完整实例。

可以从类型安全的文字和keyof表达式中keyof 。

Answer 2

Partial表示共有零个或多个属性。 您想要的是Pick ：

function PartialFooMaker1(): Pick<FooType, 'prop1'> {
  return {
       prop1: true,
       // I want autocomplete in here
  };
}

function PartialFooMaker2(): Pick<FooType, 'prop2'> {
  return {
       prop2: true,
       // I also want autocomplete in here
  };
}

使用“ Pick将要求您提前提供要选择的属性，但这将为您提供IntelliSense。

另一个选择是告诉TypeScript每个工厂函数都返回一个FooType 。

type Slice<T extends object> = { [P in keyof T]: Pick<T, P> }[keyof T];

type FooFactory = () => Slice<FooType>;

const PartialFooMaker3: FooFactory = () => {
  return {
    prop1: false,
  };
};

这不会需要明确的返回类型，但推断出的类型将永远是一片 FooType -不是切片 FooType你实际上返回。 这就是为什么我建议采用第一方法。 如果您未说明所需的返回类型，则IntelliSense不会建议您返回什么。