2.TypeScript 基本数据类型

简介: TypeScript 支持与 JavaScript 几乎相同的数据类型,此外还提供了实用的枚举类型方法方便我们使用 

TypeScript 和 JavaScript 类型区别:

TypeScript  : 静态类型,强制类型;在书写的时候就要确定变量的数据类型类型

JavaScript  : 弱类型,编译语言在JS引擎执行代码的时候才知道具体数据类型; 

声明变量格式

基本数据类型

let isDone: boolean = false;
关键字 变量名 : 变量数据类型 = 赋值
let isDone: boolean;//不赋值
const b:number= 1; // const声明的变量必须赋值

这时声明 isDone 数据类型为 boolean 类型,也可以不赋值,声明变量类型.一旦确定类型后面就不能改变变量数据类型
const 声明的的 b 必须赋值;后面数据类型和值都不可变
其他基本数据类型与JS书写方式差不多.
通过这种方式,降低书写错误

array (数组)

有两种方式定义数组,第一种,在元素后面使用 [ ]:

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

第二种，使用数组泛型，Array<元素类型>：

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

Tuple

Tuple 类型也是一个数组，我们可以用它来表示一个已知元素数量和元素类型的数组。 比如，你可以定义一对值分别为 string和number类型的元组。

let x: [string, number];//给的元素必须和下面数组类型一 一匹配
x = ['hello', 10]; // 根据上面给的类型，书写里面的数组，字符串在前,数字在后
x = [10, 'hello']; // Error 错误

当访问一个已知索引的元素，会得到正确的类型：

const a = x[0];//此时a的数据类型为string
const b = x[1];//此时b的数据类型为number

使用索引进行越界访问：

x[2] = 'world'; // 报错,数组里没有这个元素

调用数组的方法：

x.push("world"); // OK 可以使用数组方法添加
x.push(true); // Error, 报错,添加类型只能是声明数组时定义的数据类型

1、使用索引来访问越界元素，编译器会报错误

2、使用 push 方法新增元素，元素的类型必须满足其联合类型

enum

enum 类型是对 javascript 标准数据类型的一个补充。

enum Days { Sun, Mon, Tue, Wed, Thu, Fri, Sat };//创建

默认情况下，枚举成员从 0 开始赋值，每次递增步长为 1，同时，可以从值到名进行反向映射：

// 0-6
console.log(Days["Sun"] === 0); // true
console.log(Days["Mon"] === 1); // true
console.log(Days["Tue"] === 2); // true
console.log(Days["Sat"] === 6); // true

// Sun-Thu
console.log(Days[0] === "Sun"); // true
console.log(Days[1] === "Mon"); // true
console.log(Days[2] === "Tue"); // true
console.log(Days[6] === "Sat"); // true

同时，我们也可以对枚举项进行手动赋值，当值为 number 类型时，未赋值的枚举项会接着上一个枚举项依次赋值。

enum Days { Sun = 2, Mon, Tue = 5, Wed, Thu, Fri, Sat };

console.log(Days.Sun);  // 2
console.log(Days.Mon);  // 3
console.log(Days.Tue);  // 5
console.log(Days.Wed);  // 6
console.log(Days.Thu);  // 7

原理 下面是编译TS文件后dist下自动生成的JS文件

//原理
var Days;
(function (Days) {
    Days[Days["Sun"] = 0] = "Sun";
    Days[Days["Mon"] = 1] = "Mon";
    Days[Days["Tue"] = 2] = "Tue";
    Days[Days["Wed"] = 3] = "Wed";
    Days[Days["Thu"] = 4] = "Thu";
    Days[Days["Fri"] = 5] = "Fri";
    Days[Days["Sat"] = 6] = "Sat";
})(Days || (Days = {}));

执行最里面的Days["Sun"] = 0 所以console.log(Days["Sun"] === 0); // true

执行最外面的Days[Days["Sun"] = 0]所以 console.log(Days[0] === "Sun"); // true

.

如果枚举项的值有重复的话，typescript 不会提示错误，但是通过 value 获取 key 的话，key 是最后一次的枚举项：

enum Days { Sun = 2, Mon = 2, Tue = 1, Wed, Thu, Fri, Sat };
console.log(Days[2]); // Wed

在使用的时候，最好不要出现覆盖的情况。

手动赋值的枚举项可以不是 number 类型，但是，紧跟着的枚举项必须给初始值，否则会报错。

enum Days { Sun = "s", Mon = 2, Tue = 1, Wed, Thu, Fri, Sat };

any

any 表示可以赋值为任意类型。

let myFavoriteNumber: any = 'seven';
myFavoriteNumber = 7;

针对未声明类型的变量，它会被识别为 any：

let something;
something = 'seven';
something = 7;

void

某种程度上来说，void类型像是与any类型相反，它表示没有任何类型。当一个函数没有返回值时，你通常会见到其返回值类型是 void：

function bar(): void {}