基础类型的分类

分类

• boolean：布尔值
• number： 支持2/8/10/16进制
• string：字符串
• array：普通数组，有2种方式，string[]或者Array
• tuple：元组，特殊数组，指定数组里的每个元素的类型，同时也确定了元素个数
• any：不确定类型的变量
• enum：枚举类型，可根据value找到key
• void: 没有任何返回值的函
• undefined/null：2种特殊类型
• <>：非常确定的类型

数组和元组的区别？

数组：合并相同类型

元组：合并不同类型的对象，函数编程语言常用

void和undefined/null区别?

• undefined 和 null 是所有类型的子类型。
• undefined 可赋值给 number 类型变量
• void 不能赋值给 number 类型的变量

// 这样不会报错
let num: number = undefined;
//  这样会报错
let u: void;
let num: number = u;
// Type 'void' is not assignable to type 'number'.

boolean

// boolean
let isDone: boolean = true;
let disabled: boolean = false;
console.log(`isDone: ${isDone}`);   // isDone: true
console.log(`disabled: ${disabled}`); //disabled: false

number

// number 
// 十进制,十六进制,八进制,二进制
let n1: number = 666;
let n2: number = 0x0a;
let n3: number = 0o17;
let n4: number = 0b11;
console.log(`n1: ${n1}`); // n1: 666
console.log(`n2: ${n2}`); // n2: 10
console.log(`n3: ${n3}`); // n3: 15
console.log(`n4: ${n4}`); // n4: 3

string

// string
// 支持模板字符串
let myname: string = 'john';
let myage: number = 18;
let greeting: string = `i am ${myname} and i am ${myage} years old!`
console.log(greeting); // i am john and i am 18 years old!

array

第2中方式：Array就是数组泛型（Array Generic）

// 2种array定义方式
let arr1: string[] = ['a','b'];
let arr2: Array<number> = [1,2,3];

console.log(arr1); // [ 'a', 'b' ]
console.log(arr2); // [ 1, 2, 3 ]

类数组是什么？

比如 arguments 是类数组，不能用普通数组接收，

应该用interface接收，比如：IArguments, NodeList, HTMLCollection 等

比如 let args:IArguments = arguments

tuple

// tuple 元组
// 特殊的数组 定义了类型和数目的数组(指定每个元素的类型)
let tp1: [number, string] = [1,'abc'];
let tp2: [number, string, string] = [1,'abc', ''];

tp2[2] = 'x';
// tp2[3] = 'y'; // tuple定义后，不能再新增元素

console.log(tp1); // [ 1, 'abc' ]
console.log(tp2); // [ 1, 'abc', 'x' ]

tuple定义后，不能再新增元素，

否则报错 y is not assignable to type

enum

使用方式：先定义枚举集合，划定常量范围

枚举作用：可以通过下标反过来获取对应的key

// enum
// 可以全部默认赋值，部分手动赋值，全部手动赋值
enum Color {Red = 2, Green = 1, Blue};

let c1: Color = Color.Red; // c1=2
let c2: Color = Color.Green;  // c2=1 
let c3: Color = Color.Blue; // c3=2

let cname1: string = Color[2];
console.log(cname1); // 'Blue' 对应的是key

any

任意值: 不确定类型的变量

变量声明未指定其类型

• 会被识别为任意值类型
• let a; 等价于 let a:any;

使用场景：

1. 不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。
2. 调用不存在的方法时，编译时通过运行时报错

// any 
let notSure: any;

notSure = 1;
console.log(notSure); // 1

notSure = 'abc';
console.log(notSure); // 'abc'

void

void表示没有任何类型。 使用场景：函数没有返回值的情况

// void
function f1(): void{
    console.log('no return');
}
function f2(): string{
    return 'have return'
}
console.log(f1()); // void -> no return
console.log(f2()); // have return

undefined null

// undefined null
let empty1: undefined = undefined;
let empty2: null = null;

console.log(empty1); //  undefined
console.log(empty2); //  null

内置对象

ts.xcatliu.com/basics/buil…

• ECMAScript 的内置对象 Boolean、Error、Date、RegExp
• DOM 和 BOM 的内置对象 Document、HTMLElement、Event、NodeList

let body: HTMLElement = document.body;
let allDiv: NodeList = document.querySelectorAll('div');
document.addEventListener('click', function(e: MouseEvent){
    // do something
})

类型推论

ts自动进行类型推论(类似自动类型转换)

1. 变量定义时有赋值：根据[赋值]推测出[类型]
2. 定义时没有赋值：被推断成 [any 类型]

let  myName = 'Jim'; // 推断类型为string
myName = 7; //error: type number 

let  myName; // 推断类型为any
myName = 'Jim'; //ok
myName = 7; //ok

联合类型

简单例子：使用 | 分隔每个类型（可能多种类型）

访问属性和方法：只能访问公共的属性或方法

类型推论：如果有赋值，则会有类型推断

类型别名

语法： 关键字是type

用途：常用于联合类型

类型断言

类型断言：表示程序员非常确认类型，可以实现类型自动转化

语法：

• <类型>值，比如str, counter

• 值 as 类型 ，比如 str as string, counter as number

// <>
// 类型断言，
let verysure: any = 'very sure type';
let verysureLength: number = (<string>verysure).length;
console.log(verysure); // very sure type
console.log(verysureLength); // 14

使用场合：非常确定是联合类型中的某一个

注意：类型断言不是类型转换，断言成不存在的类型是不允许的

字符串可选值

用途：约束字符串类型，只能是某几个字符串中的一个

语法：type 和 分隔符定义

泛型

作用：[预先不指定]具体类型，[使用时指定]类型

语法：

1. 函数名后定义泛型参数，

2. 函数入参和返回值使用泛型参数，

3. 支持单泛型和多泛型

注意：事先不知道泛型是哪种类型，所以不能随意的操作它的属性或方法

个人理解：可以兼容不同类型，根据输入值来决定类型

声明合并

是什么？

如果定义两个相同名字的函数、接口或类 那么它们会合并成一个类型

注意

如果同名属性，则合并属性的类型必须是唯一的

合并类型： 函数合并， 接口合并， 类合并