TypeScript 中的高级类型

ops/2024/10/19 2:14:41/

文章目录

    • 一、是什么
    • 二、有哪些
      • 交叉类型
      • 联合类型
      • 类型别名
      • 类型索引
      • 类型约束
      • 映射类型
      • 条件类型
    • 三、总结

一、是什么

在 TypeScript 中,除了基本类型如 stringnumberboolean 之外,还存在一系列高级类型。这些高级类型是 TypeScript 为了增加语言灵活性和应对复杂开发场景而提供的一些语言特性。

二、有哪些

以下是一些常见的高级类型及其应用:

交叉类型

交叉类型通过 & 操作符将多个类型合并为一个类型,新类型包含了所有合并类型的特性。
语法:

T & U

示例:

function extend<T, U>(first: T, second: U): T & U {let result: T & U = { ...first, ...second };return result;
}

联合类型

联合类型表示一个值可以是几种类型之一,使用 | 操作符定义。
语法:

T | U

示例:

function formatCommandline(command: string[] | string) {let line = typeof command === 'string' ? command.trim() : command.join(' ').trim();
}

类型别名

类型别名用来给一个类型起一个新名字,可以用于原始值、联合类型、元组等。
语法:

type SomeName = someValidTypeAnnotation

示例:

type some = boolean | string;
const b: some = true; // ok
const c: some = 'hello'; // ok
// const d: some = 123; // Error

类型别名也可以是泛型:

type Container<T> = { value: T };

类型索引

keyof 类似于 Object.keys,用于获取一个类型中所有键的联合类型。
示例:

interface Button {type: string;text: string;
}
type ButtonKeys = keyof Button; // "type" | "text"

类型约束

类型约束通过 extends 关键字对泛型进行限制。
示例:

type BaseType = string | number | boolean;
function copy<T extends BaseType>(arg: T): T {return arg;
}

类型约束常与类型索引一起使用:

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

映射类型

映射类型通过 in 关键字对已有类型的键进行遍历和操作。
示例:

type Readonly<T> = {readonly [P in keyof T]: T[P];
};
interface Obj {a: string;b: string;
}
type ReadOnlyObj = Readonly<Obj>;

条件类型

条件类型是一种根据条件表达式来决定类型的类型。
语法:

T extends U ? X : Y

示例:

type NonNullable<T> = T extends null | undefined ? never : T;

三、总结

TypeScript 的高级类型为开发者提供了强大的工具来处理复杂的类型关系和场景。掌握这些高级类型是深入理解和有效使用 TypeScript 的关键。随着 TypeScript 版本的不断更新,新的特性也在不断加入,因此持续学习和实践是必要的。


http://www.ppmy.cn/ops/125645.html

相关文章

基于springboot+vue实现的花园管理系统

基于springbootvue实现的花园管理系统 &#xff08;源码L文ppt&#xff09;4-074 4功能结构 为了更好的去理清本系统整体思路&#xff0c;对该系统以结构图的形式表达出来&#xff0c;设计实现该“花开富贵”花园管理系统的功能结构图如下所示&#xff1a; 图4-1 系统总体结…

DAY15

UE4学习 蓝图 可以将蓝图看作一个封装好的函数&#xff0c;整个函数的代码以节点的形式展现。蓝图之间通过输入参数和输出参数相连接。当前蓝图的输入参数是前一个蓝图的输出参数&#xff0c;当前蓝图的输出参数是后一个蓝图的输入参数。 蓝图的创建 1.在内容浏览器的任意位…

基于依赖注入技术的.net core WebApi框架创建实例

依赖注入&#xff08;Dependency Injection, DI&#xff09;是一种软件设计模式&#xff0c;用于实现控制反转&#xff08;Inversion of Control, IoC&#xff09;。在ASP.NET Core中&#xff0c;依赖注入是内置的核心功能之一。它允许你将应用程序的组件解耦和配置&#xff0c…

用Python实现运筹学——Day 16: 整数规划简介

一、学习内容 1. 整数规划的定义 整数规划&#xff08;Integer Programming, IP&#xff09;是线性规划的一种扩展&#xff0c;其中一些或所有的决策变量必须是整数。这类问题常见于许多实际应用场景中&#xff0c;比如员工排班、投资组合优化、设施选址等。这些问题中的变量…

qt小练习

制作简易闹钟 头文件 #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QTimer> //定时器类 #include <QDebug> //信息调试类 #include <QMessageBox> //消息对话框类 #include <QTime> //时间类 #include…

Error:WPF项目中使用oxyplot,错误提示命名空间中不存在“Plot”名称

在OxyPlot中&#xff0c;<oxy:PlotView>和<oxy:Plot>都是用来显示图表的控件&#xff0c;在WPF项目中使用oxyplot之前&#xff0c;先通过NuGet安装依赖包&#xff1a;OxyPlot.Wpf。 <oxy:PlotView>和<oxy:Plot>使用示例&#xff1a; <oxy:PlotVie…

鸿蒙开发(NEXT/API 12)【安全单元访问开发】网络篇

简介 安全单元&#xff08;SecureElement&#xff0c;简称SE&#xff09;&#xff0c;电子设备上可能存在一个或多个安全单元&#xff0c;比如有eSE(Embedded SE)和SIM卡。能够充当安全单元的SIM卡&#xff0c;要求具备NFC功能。 场景介绍 应用程序可以通过接口访问安全单元…

Web自动化Demo-Kotlin+Selenium

1.新建工程 打开Aqua&#xff0c;点击New Project选中Kotlin&#xff0c;配置如下&#xff1a; 然后在build.gradle.kts文件中添加依赖 plugins {kotlin("jvm") version "1.9.23" }group "org.example" version "1.0-SNAPSHOT"rep…