TypeScript的基础类型和高级类型梳理总结

news/2024/5/20 2:53:15 标签: typescript, ts, 数据类型

一、基础类型

1、boolean 布尔类型

表示逻辑值,可以是 true 或 false

let isBoolean:boolean = false

2、number 数字类型

表示整数和浮点数(例如 423.14159),不论是十进制、二进制、八进制还是十六进制,都是number类型

let decimal: number = 6;  
let hex: number = 0xf00d;

3、string 字符串类型

表示文本类型的数据,使用单引号或双引号包围

let color: string = "blue";  
color = 'red';

4、array 数组类型

表示一个元素列表,元素类型相同。有两种方式可以定义数组,两种写法是等价的,都可

let list: number[] = [1, 2, 3];  
let list: Array<number> = [1, 2, 3];

5、tuple 元组类型

表示一个已知元素数量和类型的数组,各元素的类型可以不必相同

let x: [string, number] = ['您好!', 666]

6、enum 枚举类型

enum类型是对JavaScript标准数据类型的一个补充,使用枚举类型可以为一组数值赋予友好的名字。在开发中,后端返回的一些类型全是数值,在前端代码中直接使用数据,语义化不明显,也影响阅读,所以使用枚举转换一下更推荐

enum Color {Red = 1, Green = 2, Blue = 4}
let c: Color = Color.Green;  //c就等于 2

7、any 任何类型

当不确定一个变量应该是什么类型的时候,可以使用 any 类型。any 类型是 TypeScript 的一个强大特性,它允许我们在编译时可选择地包含或移除类型检查。但建议尽量不要使用,如果大量使用any,那使用ts的意义就失去了

let notSure: any = 666;

//notSure没有指定具体类型,这里的赋值不会报错,即使notSure初始值是一个number类型
notSure = "maybe a string instead"; 

8、void  没有返回值的函数的返回类型

当一个函数没有返回值时,采用void,如果有返回值,应该写返回值的具体类型

function warnUser(): void {  
    console.log("This is my warning message"); 
    //这个函数没有返回值 
}

9、Null

在 TypeScript 中,null 值有自己的类型 null; null是所有类型的子类型

let n: null = null;

10、Undefined

在 TypeScript 中,undefined 有它专门的类型 undefined,undefined是所有类型的子类型

let u: undefined = undefined; 

11、never

表示的是那些永不存在的值的类型, 例如, never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型; 变量也可能是 never类型,当它们被永不为真的类型保护所约束时。never类型是任何类型的子类型,也可以赋值给任何类型,但除never类型本身,其他的类型都不可以赋值给never类型,包括any

function error(message: string): never {  
    throw new Error(message);  
}

12、Object 对象类型

表示非原始类型的对象类型,如下,参数O 和 lngLat都只接受对象类型数据传入

declare function create(o: object | null): void;
或
funtion getAddress(lngLat:{lng: string, lat: string} | null): string

二、高级类型

1、Intersection Types 交叉类型 

使用 & 分隔不同的类型,表示交叉类型是将多个类型合并为一个类型。这让我们可以把多个类型的成员合并到一个类型里,可以理解为取这些类型的并集

type A = {x: number}
type B = {y: number}
type Combined  = A & B//表示Combined类型必须同时具有x和y属性。

2、union types 联合类型

使用 | 分隔不同的类型,联合类型表示一个值可以是几种类型之一,所以 number | string | boolean 表示一个值可以是 number, string,或 boolean
如果一个值是联合类型,我们只能访问此联合类型的所有类型里共有的成员,可以理解为取 交集

interface Bird {
    fly();
    layEggs();
}

interface Fish {
    swim();
    layEggs();
}

function getSmallPet(): Fish | Bird {
    // ...
}

let pet = getSmallPet();
pet.layEggs(); // okay
pet.swim();    // errors, swim不是共有成员

3、Type Aliases 类型别名

类型别名会给一个类型起个新名字。 类型别名有时和接口很相似,但是可以作用于原始类型,联合类型,元组和字面量。

type Name = string; //用Name 代替原始类型string
type NameResolver = () => string;
type NameOrResolver = Name | NameResolver;
function getName(n: NameOrResolver): Name {//这里的函数返回值是string,因为第一行代码对string进行了别名,所以就可以用Name代替string
    if (typeof n === 'string') {
        return n;
    }
    else {
        return n();
    }
}

类型别名不能出现在声明右侧的任何地方

type Yikes = Array<Yikes>; // error

4、String Literal Types 字符串字面量类型

表示允许指定字符串必须的固定值,和联合类型一起使用,可以实现类似枚举类型的字符串

type SuperAdmin = "admin"
type Easing = "ease-in" | "ease-out" | "ease-in-out"; //与联合类型结合使用

5、Numeric Literal Types 数值字面量类型

与字符串字面量类型类似,数值字面量类型用来约束取值只能是特定的数值。

function rollDice(value: 1 | 2 | 3 | 4 | 5 | 6) {  
    console.log(`Player rolled a ${value}`);  
}

6、Type Guards 类型保护

类型保护就是一些表达式,它们会在运行时检查以确保在某个作用域里的类型。 要定义一个类型保护,我们只需要简单地为一个函数的返回值为类型谓词

pet is Fish就是类型谓词。 谓词为 parameterName is Type这种形式

function isFish(pet: Fish | Bird): pet is Fish {
    return (<Fish>pet).swim !== undefined;
}

还可以用typeof 进行类型保护, TS本身会把typeof识别成类型保护,所以可以直接在代码中使用

function padLeft(value: string, padding: string | number) {
    if (typeof padding === "number") {
        return Array(padding + 1).join(" ") + value;
    }
    if (typeof padding === "string") {
        return padding + value;
    }
    throw new Error(`Expected string or number, got '${padding}'.`);
}

7、Mapped Types 映射类型

它基于旧类型但是以某种方式对每个属性进行修改,这就是映射类型。例如,你可以获取一个类型的所有属性并使其成为只读
 

//旧接口
interface PersonPartial {
    name: string;
    age: number;
}

//映射旧接口,获得新接口
type Readonly<T> = {
    readonly [P in keyof T]: T[P];
}
type ReadonlyPerson = Readonly<Person>;

//新接口等同如下
interface PersonReadonly {
    readonly name: string;
    readonly age: number;
}


8、Conditional Types 条件类型

条件类型是一种表达形式,它类似于 JavaScript 中的三元运算符,用于选择两种类型之一。 条件类型在描述输入与输出类型之间关系的时候非常有用,并且能用来提取复杂类型中的信息。

type IsStringType<T> = T extends string ? true : false;  
  
type A = IsStringType<'hello'>; // type A: true  
type B = IsStringType<number>;  // type B: false


http://www.niftyadmin.cn/n/5420408.html

相关文章

NIO学习总结(一)——简介、Channel、Buffer

相关代码地址&#xff1a;nio_demo_learn: nio学习相关代码 (gitee.com) 一、BIO、NIO和AIO 1.1 阻塞IO&#xff08;BIO&#xff09; BIO即同步阻塞IO&#xff0c;实现模型为一个连接就需要一个线程去处理。这种方式简单来说就是当有客户端来请求服务器时&#xff0c;服务器就…

精通SpringBoot单元测试

引言 单元测试是软件开发中不可或缺的一部分&#xff0c;它对保障代码质量和软件的可靠性起着至关重要的作用。而SpringBoot作为一个流行的Java框架&#xff0c;为开发高效、易于部署的微服务提供了强大的支持。 单元测试的重要性&#xff1a; 确保代码正确性&#xff1a;通过…

Leetcode 3076. Shortest Uncommon Substring in an Array

Leetcode 3076. Shortest Uncommon Substring in an Array 1. 解题思路2. 代码实现 题目链接&#xff1a;3076. Shortest Uncommon Substring in an Array 1. 解题思路 这一题我的思路上很暴力&#xff0c;就是直接把所有可能的substring全部统计出来放到一起。 然后&#…

Django 数据库表模型与迁移

Django 数据库表模型开发 0、创建 Django 项目 python -m django --version 检查 Django 安装。django-admin startproject mysite 激活虚拟环境,找个好地方创建项目。在 manage.py 同级目录下: python manage.py runserver [port] 启动 Django 项目。 python manage.py sta…

linux 安装OpenRestry

一、OpenRestry官网 openRestry中文官网 openRestry英文官网 二、OpenRestry搭建 可以参考官方提供的网址进行搭建&#xff1a;OpenRestry安装官网 ​ 三、开始安装 1、安装依赖库 yum install libtermcap-devel ncurses-devel libevent-devel readline-devel pcre-deve…

c语言:倒序4位数

倒序4位数 任务描述 输入一个4位的正整数&#xff0c;输出它的倒序数。 输入示例1 1200输出示例1 0021输入示例2 1234输出示例2 4321代码 #include<stdio.h> int main() {int a;int num;scanf("%d", &a);num a % 10; // 个位数printf("%d&q…

章六、集合(1)—— 概念、API、List 接口及实现类、集合迭代

零、 关闭IDEA调试时自动隐藏空元素 一、 集合的概念 存储一个班学员信息&#xff0c;假定一个班容纳20名学员 当我们需要保存一组一样&#xff08;类型相同&#xff09;的元素的时候&#xff0c;我们应该使用一个容器来存储&#xff0c;数组就是这样一个容器。 数组有什么缺…

【C/C++ 学习笔记】指针

【C/C 学习笔记】指针 视频地址: Bilibili 概念 可以通过指针间接访问内存用于保存地址 使用 通过 & 可以获取数据的指针 通过 * 可以取得指针的数据 指针的数据类型就是 数据类型 * int number 10;int *p &number;// 10 cout << "number: " …