TypeScript 类型

2025年3月17日 | 阅读 7 分钟

TypeScript 语言支持不同类型的值。它为 JavaScript 提供了数据类型，以将其转换为强类型编程语言。JavaScript 不支持数据类型，但在 TypeScript 的帮助下，我们可以在 JavaScript 中使用数据类型功能。当面向对象的程序员希望在任何脚本语言或面向对象编程语言中使用类型特性时，TypeScript 起着重要作用。类型系统在程序使用它们之前检查给定值的有效性。它确保代码按预期运行。

TypeScript 将数据类型作为可选类型系统提供。我们可以将 TypeScript 数据类型分类如下。

1. 静态类型

在类型系统的上下文中，静态类型意味着“在编译时”或“在不运行程序的情况下”。在静态类型语言中，变量、参数和对象具有编译器在编译时知道的类型。编译器使用此信息来执行类型检查。

静态类型可以进一步分为两个子类别

内置或原始类型

TypeScript 有五种内置数据类型，如下所示。

数字

与 JavaScript 一样，TypeScript 中的所有数字都存储为浮点值。这些数值被视为数字数据类型。数字数据类型可用于表示整数和小数。TypeScript 还支持二进制（Base 2）、八进制（Base 8）、十进制（Base 10）和十六进制（Base 16）字面量。

语法

示例：-

let first: number = 12.0;             // number 
let second: number = 0x37CF;          // hexadecimal
let third: number = 0o377 ;           // octal
let fourth: number = 0b111001;        // binary 

console.log(first);           // 123
console.log(second);          // 14287
console.log(third);           // 255
console.log(fourth);          // 57

String

我们将使用字符串数据类型在 TypeScript 中表示文本。字符串类型处理文本数据。我们通过将字符串字面量包含在单引号或双引号中来将其包含在我们的脚本中。它还表示 Unicode 字符的序列。它以 $ {expr} 的形式嵌入表达式。

语法

let identifier: string = " ";
                Or 
let identifier: string = ' ';

示例

let empName: string = "Rohan"; 
let empDept: string = "IT"; 

// Before-ES6
let output1: string = employeeName + " works in the " + employeeDept + " department."; 

// After-ES6
let output2: string = `${empName} works in the ${empDept} department.`; 

console.log(output1);//Rohan works in the IT department. 
console.log(output2);//Rohan works in the IT department.

Boolean

字符串和数字数据类型可以具有无限数量的不同值，而布尔数据类型只能有两个值。它们是“true”和“false”。布尔值是一个真值，它指定条件是真还是假。

语法

示例

Void

void 是不返回任何类型值的函数的返回类型。它用于没有可用数据类型的地方。void 类型的变量没有用，因为我们只能将 undefined 或 null 赋值给它们。undefined 数据类型表示未初始化的变量，而 null 表示值未定义的变量。

语法

示例

1. function helloUser(): void {
       alert("This is a welcome message");
       }

2. let tempNum: void = undefined;
  tempNum = null;    
  tempNum = 123;      //Error

Null

Null 表示值未定义的变量。与 void 非常相似，它本身并不是特别有用。Null 仅接受一个值，即 null。Null 关键字用于在 TypeScript 中定义 Null 类型，但它没有用，因为我们只能为其分配一个 null 值。

示例

let num: number = null;
let bool: boolean = null; 
let str: string = null;

未定义

Undefined 原始类型表示 TypeScript 和 JavaScript 中所有未初始化的变量。它只有一个值，即 undefined。undefined 关键字在 TypeScript 中定义了 undefined 类型，但它没有用，因为我们只能为其分配一个 undefined 值。

示例

let num: number = undefined;
let bool: boolean = undefined;
let str: string = undefined;

Any 类型

它是 TypeScript 中所有数据类型的“超级类型”。它用于表示任何 JavaScript 值。它允许我们在编译期间选择加入和退出类型检查。如果变量不能用任何基本数据类型表示，则可以使用“Any”数据类型声明它。当我们不知道值的类型（可能来自 API 或第三方库）并且我们希望在编译时跳过类型检查时，Any 类型很有用。

语法

示例

1. let val: any = 'Hi';
      val = 555;   // OK
      val = true;   // OK         

2. function ProcessData(x: any, y: any) {
                       return x + y;
            }
            let result: any;
            result = ProcessData("Hello ", "Any!"); //Hello Any!
            result = ProcessData(2, 3); //5

用户定义的数据类型

TypeScript 支持以下用户定义的数据类型

Array

数组是相同数据类型元素的集合。与 JavaScript 一样，TypeScript 也允许我们使用值数组。数组可以通过两种方式编写

1. 使用元素类型后跟 [] 来表示该元素类型的数组

2. 第二种方法使用通用数组类型

元组

元组是一种数据类型，它包含两组不同数据类型的值。它允许我们表示一个数组，其中已知固定数量的元素的类型，但它们并不相同。例如，如果我们想将一个值表示为数字和字符串的对，则可以将其写为

// Declare a tuple
let a: [string, number];

// Initialize it
a = ["hi", 8, "how", 5]; // OK

Interface

接口是一个结构，它充当我们应用程序中的一个契约。它定义了类要遵循的语法，意味着实现接口的类必须实现其所有成员。它不能被实例化，但可以被实现它的类引用。TypeScript 编译器使用接口进行类型检查，这也被称为“鸭子类型”或“结构子类型”。

示例

interface Calc {
    subtract (first: number, second: number): any;
}
 
let Calculator: Calc = {
    subtract(first: number, second: number) {
        return first - second;
    }
}

Class

类用于创建可重用的组件，并充当创建对象的模板。它是一个逻辑实体，它存储变量和函数以执行操作。TypeScript 从 ES6 获得了对类的支持。它与接口不同，接口在其内部有一个实现，而接口在其内部没有任何实现。

示例

class Student
{
    RollNo: number;
    Name: string; 
    constructor(_RollNo: number, Name: string) 
    {
        this.RollNo = _rollNo;
        this.Name = _name;
    }
    showDetails()
    {
        console.log(this.rollNo + " : " + this.name);
    }
}

Enums

枚举定义一组命名常量。TypeScript 提供基于字符串和基于数字的枚举。默认情况下，枚举从 0 开始为其元素编号，但我们也可以通过手动将值设置为其元素之一来更改此设置。TypeScript 从 ES6 获得了对枚举的支持。

示例

enum Color {
        Red, Green, Blue
};
let c: Color;
Color = Color.Green;

函数

函数是组织程序的代码的逻辑块。与 JavaScript 一样，TypeScript 也可以用于创建函数，可以是命名函数，也可以是匿名函数。函数确保我们的程序是可读的、可维护的和可重用的。函数声明具有函数名称、返回类型和参数。

示例

//named function with number as parameters type and return type
function add(a: number, b: number): number {
            return a + b;
}

//anonymous function with number as parameters type and return type
let sum = function (a: number, y: number): number {
            return a + b;
};

2. 泛型

泛型用于创建一个可以处理多种数据类型而不是单个数据类型的组件。它提供了一种创建可重用组件的方法。它确保程序具有灵活性，并且从长远来看具有可伸缩性。TypeScript 将泛型与类型变量 <T> 一起使用，该变量表示类型。泛型函数的类型与非泛型函数非常相似，类型参数首先列出，类似于函数声明。

示例

function identity<T>(arg: T): T {
    return arg;
}
let output1 = identity<string>("myString");
let output2 = identity<number>( 100 );

3. 装饰器

装饰器是一种特殊的数据类型，可以附加到类声明、方法、属性、访问器和参数。它提供了一种为类和函数添加注释和元编程语法的方式。它与“@”符号一起使用。

装饰器是一项实验性功能，可能会在未来的版本中发生变化。要启用对装饰器的支持，我们必须在命令行或 tsconfig.json 中启用 experimentalDecorators 编译器选项。

示例

function f() {
    console.log("f(): evaluated");
    return function (target, propertyKey: string, descriptor: PropertyDescriptor) {
        console.log("f(): called");
    }
}

class C {
    @f()
    method() {}
}

下一个主题Null 和 Undefined 之间的区别

← 上一个下一个 →

TypeScript 类型

1. 静态类型

内置或原始类型

数字

String

Boolean

Void

Null

未定义

Any 类型

用户定义的数据类型

Array

元组

Interface

Class

Enums

函数

2. 泛型

3. 装饰器

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

TypeScript 教程

差异

面试题

TypeScript 类型

1. 静态类型

内置或原始类型

数字

String

Boolean

Void

Null

未定义

Any 类型

用户定义的数据类型

Array

元组

Interface

Class

Enums

函数

2. 泛型

3. 装饰器

相关帖子

TypeScript 组件

环境声明

Typescript 装饰器

Typescript 命名空间

TypeScript 函数

Typescript Map

Typescript 类

Typescript Set

TypeScript Switch 语句

Typescript tsconfig.json

订阅 Tpoint Tech

联系信息

关注我们

教程

面试题

在线编译器