带你读《现代TypeScript高级教程》九、类型推断

简介: 带你读《现代TypeScript高级教程》九、类型推断

九、类型推断

TypeScript通过类型推断可以自动推导出变量和表达式的类型,提高代码的可读性和可维护性。

1.类型推断

类型推断是 TypeScript 在编译时根据上下文自动推导变量和表达式的类型。它根据变量的赋值、函数的返回值、表达式的操作等信息来确定变量或表达式的最佳类型。

1 基础类型推断

TypeScript根据变量的初始值来推断基础类型,包括字符串、数字、布尔值等。

 

let name = "John";  // 推断为string类型let age = 30;  // 推断为number类型let isStudent = true;  // 推断为boolean类型

2 最佳公共类型推断

当我们将不同类型的值赋给一个变量或数组时,TypeScript会根据这些值的类型推断出一个最佳公共类型。

 

let values = [1, 2, "three", true];  // 推断为(number | string | boolean)[]

 

在上面的示例中,数组values包含了数字、字符串和布尔值,TypeScript推断出这个数组的类型为(number | string | boolean)[],即联合类型。

3 上下文类型推断

TypeScript会根据上下文中的预期类型推断变量的类型。这种上下文可以是函数参数、赋值语句等。

function greet(person: string) {
  console.log(`Hello, ${person}!`);}
greet("John");  // person的类型推断为string

 

在上面的示例中,函数greet的参数person的类型被推断为string,因为在函数调用时传入的实参是一个字符串。

4 类型断言

如果我们希望手动指定一个变量或表达式的类型,可以使用类型断言(Type Assertion)来告诉TypeScript我们的意图。

 

let value = "Hello, TypeScript!";let length = (value as string).length;  // 类型断言为string

 

在上面的示例中,我们使用类型断言as string将变量value的类型指定为string,以便在后面获取其长度时,TypeScript能正确推断出类型。

5 类型推断和泛型

在使用泛型时,TypeScript会根据传入的参数类型推断泛型类型的具体类型。

 

function identity(value: T): T {
  return value;}
let result = identity("Hello, TypeScript!");  // result的类型推断为string

 

在上面的示例中,泛型函数identity的参数value的类型被推断为传入的实参

类型,因此返回值的类型也被推断为string

2.总结

类型推断是TypeScript中的一个重要特性,通过自动推导变量和表达式的类型,可以提高代码的可读性和可维护性。TypeScript根据赋值、返回值、上下文等信息进行类型推断,并在需要时允许手动指定类型。在编写现代化高级TypeScript代码时,深入了解和应用类型推断是非常重要的一部分。通过结合最新的TypeScript语法和类型推断,我们可以编写更具表达力和类型安全的代码。

 

相关文章
|
3月前
|
JavaScript 前端开发
TypeScript【类型别名、泛型】超简洁教程!再也不用看臭又长的TypeScript文档了!
【10月更文挑战第11天】TypeScript【类型别名、泛型】超简洁教程!再也不用看臭又长的TypeScript文档了!
|
3月前
|
JavaScript 前端开发 Java
TypeScript【接口】超简洁教程!再也不用看臭又长的TypeScript文档了!
【10月更文挑战第10天】TypeScript【接口】超简洁教程!再也不用看臭又长的TypeScript文档了!
|
3月前
|
JavaScript 前端开发 安全
TypeScript【基础类型】超简洁教程!再也不用看臭又长的TypeScript文档了!
【10月更文挑战第9天】TypeScript【基础类型】超简洁教程!再也不用看臭又长的TypeScript文档了!
|
5月前
|
JavaScript 前端开发 编译器
TypeScript教程(一)在vscode中的配置TypeScript环境
本文是一篇TypeScript入门教程,介绍了在VS Code中配置TypeScript环境的步骤,包括安装Node.js、使用npm安装TypeScript、配置npm镜像源、安装VS Code的TypeScript扩展,以及创建和运行一个简单的TypeScript "Hello World"程序。
TypeScript教程(一)在vscode中的配置TypeScript环境
|
3月前
|
JavaScript 索引
TypeScript(TS)安装指南与基础教程学习全攻略(二)
TypeScript(TS)安装指南与基础教程学习全攻略(二)
63 0
|
3月前
|
JavaScript 前端开发 安全
TypeScript(TS)安装指南与基础教程学习全攻略(一)
TypeScript(TS)安装指南与基础教程学习全攻略(一)
38 0
|
5月前
|
资源调度 JavaScript 前端开发
TypeScript实战教程(一):表单上传与后端处理
本文是TypeScript实战教程的第一部分,介绍了使用TypeScript进行表单上传和后端处理的完整流程,包括环境配置、前端表单创建、使用TypeScript和Express框架搭建服务端、处理表单数据,并提供了详细的代码示例和运行测试方法。
TypeScript实战教程(一):表单上传与后端处理
|
3月前
|
JavaScript 前端开发 安全
深入理解TypeScript:增强JavaScript的类型安全性
【10月更文挑战第8天】深入理解TypeScript:增强JavaScript的类型安全性
68 0
|
3月前
|
JavaScript 前端开发 开发者
深入理解TypeScript:类型系统与实用技巧
【10月更文挑战第8天】深入理解TypeScript:类型系统与实用技巧
|
4月前
|
存储 JavaScript
typeScript进阶(11)_元组类型
本文介绍了TypeScript中的元组(Tuple)类型,它是一种特殊的数组类型,可以存储不同类型的元素。文章通过示例展示了如何声明元组类型以及如何给元组赋值。元组类型在定义时需要指定数组中每一项的类型,且在赋值时必须满足这些类型约束。此外,还探讨了如何给元组类型添加额外的元素,这些元素必须符合元组类型中定义的类型联合。
60 0