请解释这个涉及 generics 和类型别名的 typescript 语法

Question

我正在尝试学习一些教程，但在理解 typescript 语法时遇到了困难。 请提供对以下 typescript 语法的解释

1

type ValidationResult<T, U> = Partial<{ [Key in keyof T]: U }>;

我在 typescript 手册的 generics 章节中找不到一个示例，该示例描述了上述语句的<T, U>部分之类的内容-这是什么意思？ 这是否意味着输入T而U是 output？

我理解 Partial 但似乎无法理解Partial<{ [Key in keyof T]: U }>请解释一下这是什么意思

2

type Validation<T, U> = (fields: T) => ValidationResult<T, U>; 

上述语句是否为接受类型T并返回ValidationResult<T, U>的 function 定义了类型别名？

U代表什么？

3

const hasLength = <T>(len: number, input: string | Array<T>) =>
input.length >= len;

const hasUserName = (input: string) =>
hasLength(1, input) ? true : "Name is required.";

<T>(len: number, input: string | Array<T>)代表什么？

上述声明中的前导<T>是什么意思？

你能解释一下上述两个声明的含义吗？

上面两个声明const hasLength和const hasUserName是什么关系？

4

const fieldValues = {
    name: "Test User",
    level: 10,
    description: "Test Description"
};

type FieldValues = typeof fieldValues;

const validationRules = [
    ({ name }: FieldValues) => ({
        name: hasUserName(name)
    }),
    ({ description }: FieldValues) => ({
        description: hasValidDescription(description)
    })
];

我了解const fieldValues分配有 object 文字，因此fieldValues值将是

{
    name: "Test User",
    level: 10,
    description: "Test Description"
}

现在，行type FieldValues = typeof fieldValues;是什么？ 意思是？

在上面的声明中使用typeof有什么意义呢？

还要解释该语句后面的代码块

蒂亚！

Answer 1

对于初学者，“泛型”也称为“参数多态性”，第一个类型参数通常称为“T”（用于 Type），任何附加参数只是按字母顺序排列的下一个字符（T、U、V...）。

1) 部分类型

部分类型允许您构造一个新类型，具有 T 的所有属性，但它们是可选的并且可能会丢失。

type ValidationResult<T, U> = Partial<{ [Key in keyof T]: U }>;

这意味着，“我从 T 创建了一个具有类型 U 的所有属性的类型”。 例如ValidationResult<MyType, string>将包含来自“MyType”的所有字符串属性。

注意： [name-expression]: type称为“计算属性”。

interface Test{
    foo: string,
    bar: number
}

type ValidationResult<T, U> = Partial<{ [Key in keyof T]: U }>;

let v: Baz<Test, string> = { foo: 't', bar: 1 }; // Error! bar is not a string!

2) Function 型

type Validation<T, U> = (fields: T) => ValidationResult<T, U>; 

“验证”是一个 function 类型，它采用某种类型 T 并返回一个部分类型，该类型包含 T 中具有类型 U 的所有属性。

所以返回类型就是我们之前定义的，但是这个 function 只是给了我们这些 ValidationResults 之一。

3) 联合类型和匿名函数

const hasLength = <T>(len: number, input: string | Array<T>) =>
input.length >= len;

所以这是一个匿名的 function（或“lambda”）：

(len: number, input:string) => input.length >= len

这是从（数字，字符串）到 boolean 的 function。 <T>是一个类型参数，所以它是一个通用的 lambda！

<T>(n: number, T: x) => doSomething...

一种形式的string | number | T string | number | T string | number | T是一个联合类型，即它可以采用每个列出的类型中允许的任何值：'abc' 或 123 或任何 T 是...

所以'hasLength'是一个（lambda）function，它将'len'与Ts参数的字符串或数组的长度进行比较。

const hasUserName = (input: string) =>
hasLength(1, input) ? true : "Name is required.";

这只是使用上面的 function 并将字符串作为参数传递。 您也可以致电：

hasLength(1, ['a', 'b'])

那是'hasLength of number，Array'。

4) 匿名类型

所以就像你说的，我们为我们的常量分配了一个 object 文字。 但是常量的类型是什么？ 最通用的可能是“对象”，但这根本没有用！

“typeof”运算符为我们提供了 object 的类型。 即使我们从未定义过接口或 class 并且我们没有给这个 object 命名，我们已经将它的（未命名）类型放入变量“FieldValues”中。 然后我们可以使用该类型：

const validationRules = [
    ({ name }: FieldValues) => ({
        name: hasUserName(name)
    }),
    ({ description }: FieldValues) => ({
        description: hasValidDescription(description)
    })
];

这是一个包含函数的数组（参见[] ）。 function 使用一种公认的奇怪语法来表示，它需要一个名为“name”的“FieldValues”类型的 object，它返回一个 object。

Answer 2

1

type ValidationResult<T, U> = Partial<{ [Key in keyof T]: U }>;

在这个例子中U是一个泛型 - 所以它代表任何类型。 使用类型时定义这些 generics：

type ValidationResult<T, U> = Partial<{ [Key in keyof T]: U }>;

type TestType = {
    a: string,
    b: number,
};

const x: ValidationResult<TestType, string> = {
    a: 'test1',
    b: 'test2',
};

const y: ValidationResult<TestType, string> = {
    a: 'test1',
    // @ts-expect-error
    c: 'test3',
};

游乐场链接。 因此类型ValidationResult定义了一个类型，该类型将具有来自类型T的任意数量的键，并且这些键将具有类型U的值，无论定义为什么。

2

type Validation<T, U> = (fields: T) => ValidationResult<T, U>;

你说的对; Validation是 function 的一个类型，它接受一些T类型的值，并返回一个ValidationResult<T, U> ； 本例中的U定义如上，当使用类型时：

type ValidationResult<T, U> = Partial<{ [Key in keyof T]: U }>;

type TestType = {
    a: string,
    b: number,
};

type Validation<T, U> = (fields: T) => ValidationResult<T, U>;

const f1: Validation<TestType, number> = fields => ({ a: 2, b: 3 });
// @ts-expect-error
const f2: Validation<TestType, number> = fields => ({ c: 4 });

游乐场链接。

3

const hasLength = <T>(len: number, input: string | Array<T>) =>
    input.length >= len;

const hasUserName = (input: string) =>
    hasLength(1, input) ? true : "Name is required.";

<T>(len: number, input: string | Array<T>)定义了 function 的 arguments： 1. len是一个数字 2. input是string和Array<T>的联合类型； 意思是，它要么是字符串，要么是某种类型的数组T ； 这两种类型都有一个可以使用的length属性。

前导T是泛型； 它代表某种类型； 我们只是说我们不想在 function 中定义该类型是什么，它可以是任何东西。

hasLength和hasUserName的关系是后者使用前者来检查用户名是否至少是一个字符。 Typescript 可以知道，当hasUserName以input作为第二个参数调用hasLength时， hasLength中的T将是一个字符串。

4

const fieldValues = {
    name: "Test User",
    level: 10,
    description: "Test Description"
};

type FieldValues = typeof fieldValues;

const validationRules = [
    ({ name }: FieldValues) => ({
        name: hasUserName(name)
    }),
    ({ description }: FieldValues) => ({
        description: hasValidDescription(description)
    })
];

typeof是一个 typescript 关键字，它采用值的类型。 所以FieldValues实际上是一个看起来像这样的类型：

type FieldValues = {
    name: string;
    level: number;
    description: string;
};

下一个代码块定义了一个函数数组，这些函数接受一个FieldValues object，并返回一个 object。 object 上的键表示字段Values fieldValues是否对某些属性有效。 我猜他们用它来验证一些字段。