TypeScript 泛型约束

首页 / TypeScript入门教程 / TypeScript 泛型约束

在本教程中,你将学习 TypeScript 中的泛型约束。

TypeScript 中的泛型约束介绍

思考以下例子:

function merge<U, V>(obj1: U, obj2: V) {
  return {
    ...obj1,
    ...obj2,
  };
}

merge() 是一个可以合并两个对象的泛型函数:

let person = merge({ name: 'John' }, { age: 25 });

console.log(result);

输出:

{ name: 'John', age: 25 }

它工作地很好。merge() 函数接受两个对象,但它无法阻止你传递一个非对象的参数,如下所示:

let person = merge({ name: 'John' }, 25);

console.log(person);

输出:

{
  name: 'John';
}

TypeScript 没有发出任何的错误提示。你可能想给 merge() 函数添加一个约束,使得它只能处理对象而不处理其他的类型的参数。要做到这一点,你需要提出要求,作为 UV 类型的约束。

为了表示约束,你可以使用 extends 关键字:

function merge<U extends object, V extends object>(obj1: U, obj2: V) {
  return {
    ...obj1,
    ...obj2,
  };
}

因为 merge() 函数的参数受到了约束,它将不再适合用于所有类型的参数调用,它现在只适合用于 object 类型的参数调用。

下面将抛出一个错误提示:

let person = merge({ name: 'John' }, 25);

错误提示:

Argument of type '25' is not assignable to parameter of type 'object'.

在泛型约束中使用行参

TypeScript 允许声明受另外一个类型参数约束的类型参数。

下面的 prop() 函数接受一个对象和一个属性名,它会返回属性的值:

function prop<T, K>(obj: T, key: K) {
  return obj[key];
}

编译器会抛出下面的错误提示:

Type 'K' cannot be used to index type 'T'.

为了修复这个错误,你在 K 上添加一个约束来确保它是 T 类型的键,如下所示:

function prop<T, K extends keyof T>(obj: T, key: K) {
  return obj[key];
}

如果你传递给 prop() 函数一个 obj 对象上存在的属性明,编译器不会抛出错误提示,如下所示:

let str = prop({ name: 'John' }, 'name');
console.log(str);

输出:

John

然而如果传递一个在第一个参数上不存在的属性名,编译器会抛出一个错误提示:

let str = prop({ name: 'John' }, 'age');

错误提示:

Argument of type '"age"' is not assignable to parameter of type '"name"'.

小结

教程来源:网道(WangDoc.com)以及 Github cody1991 无私奉献

这一章《TypeScript 泛型约束 》你学到了什么?做站不易,你的分享是对我们最大的支持,感谢!😊

猜你喜欢

TensorFlow快速入门与实战 -〔彭靖田〕

视觉笔记入门课 -〔高伟〕

Django快速开发实战 -〔吕召刚〕

分布式金融架构课 -〔任杰〕

好记忆不如烂笔头。留下你的足迹吧 :)