TypeScript入门教程：基本数据类型详解与配置

TypeScript简介与环境配置

概述

TypeScript由C#之父Anders Hejlsberg主导开发，本质是在JavaScript基础上增加了可选的静态类型和基于类的面向对象特性，可视为JavaScript的超集。

ES5、ES6与TypeScript的关系如下：

环境安装

首先需确保已安装npm，随后执行相关命令进行安装。

npm install -g typescript

安装完成后，由于TypeScript文件以.ts为后缀，运行前需将其编译为JS文件。编译过程十分简便，只需使用tsc命令即可。

tsc hello.ts

在项目中TS文件较多时，通常需要手动配置tsconfig.json文件以优化编译过程。该配置相对简单，具体细节可自行查阅相关资料。

基础类型

TypeScript提供以下基本数据类型：

• 布尔类型（boolean）

• 数字类型（number）

• 字符串类型（string）

• 数组类型（array）

• 元组类型（tuple）

• 枚举类型（enum）

• 任意值类型（any）

• null和undefined

• void类型

• never类型

TypeScript基本数据类型详解

布尔类型（boolean）

布尔类型是最基础的数据类型，仅包含true和false两个值。

注意：布尔类型变量不能赋予其他类型的值。

let flag: boolean = true;
flag = 1; //报错

数字类型（number）

与JavaScript一致，TypeScript中的数字均为浮点型，同时支持二进制、八进制、十进制和十六进制表示法。

let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
let binaryLiteral: number = 0b1010;
let octalLiteral: number = 0o744;

字符串类型（string）

字符串可使用单引号（'）或双引号（"）定义，此外还支持使用反引号（`）创建的模板字符串，用于定义多行文本或嵌入表达式。通过${ expr }语法可嵌入变量或表达式。

let name: string = 'Angular';
let years: string = 7;
let words: string = `今年是 ${ name } 发布 ${ years } 周年`;

数组类型（array）

TypeScript中数组的操作与JavaScript类似，建议为数组元素指定单一类型。定义数组主要有两种方式：

1、在元素类型后添加[]符号。

let arr: number[] = [2,3];

2、使用数组泛型语法。

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

元组类型（tuple）

元组类型用于表示已知元素数量和类型的数组，其中各元素的类型可以不同。

let x: [string,number];
x = ['Angular',5]; //正确
x = [5,'Angular']; //报错

枚举类型（enum）

枚举是一组可命名的整型常数集合，为成员赋予有意义的名称以增强代码可读性。

enum Color {red,green,blue};
let c: Color = Color.blue;
console.log(c); //2

枚举默认索引从0开始，也可手动指定初始值。

enum Color {red = 2,green = 3,blue = 6};
let c: Color = Color.blue;
console.log(c); //6

任意值类型（any）

any类型用于处理编程时类型不明确的变量，主要适用于以下三种场景：

1、值来源于动态内容，如用户输入或第三方库。此时不希望类型检查器进行检查，而是直接通过编译阶段检查。

let x: any = 1;
x = 'I am a string';
x = false;

2、允许在编译时选择性地包含或排除类型检查。

let x: any = 4;
x.toFixed(); //正确，并不检查是否存在

3、定义存储多种类型数据的数组时。

let arrarList: any[] = [1,'qwe',true];

null和undefined

默认情况下，null和undefined是所有类型的子类型，即可以将它们赋值给number等类型的变量。

若启用--strictNullChecks选项，则null和undefined只能赋值给void或它们各自对应的类型。

let x: number;
x = 1;
x = null; //正确

启用 --strictNullChecks
let y: number;
y = 1;
y = null; //错误

void类型

void表示没有任何类型，例如函数无返回值时，其返回类型为void。

function hello(): void{
  alert('hello Angular');
}

never类型

never是其他类型（包括null和undefined）的子类型，代表永远不会出现的值。声明为never类型的变量只能被never类型赋值，在函数中通常表示抛出异常或代码无法执行到终点。

let x: never;
let y: number;
//报错
x = 123;
//正确
y = x;

以上内容为本文全部介绍，希望能为各位的学习或工作提供帮助，同时也感谢大家的支持！