TypeScript篇

一. TS基本数据类型

1. number
2. 布尔值
3. string
4. 数组
5. 元组
6. 枚举
7. any
8. void
9. null和undefined
10. never

二. TS基本数据类型说明

1. number类型

const age: number = 25

2. 布尔值类型

const flag: boolean = 25

3. string类型

const name: string = 'wangjiajia'
// 联合类型
const value: number | string = 'wangjiajia'  // value既可以是number类型也可以是string类型

4. 数组类型（以number类型数组为例）

const list: number[] = [1,2,3]
// 或者
const list: Array<number> = [1,2,3]

5. 元组tuple
   元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。 比如，你可以定义一对值分别为 string和number类型的元组。当访问一个已知索引的元素，会得到正确类型。

const user: [string,number] = ['wangjiajia',25]
x[0].substr(1)  // 正确
x[1].substr(1)  // 错误
// 当访问一个越界元素，会使用联合类型
x[2] = 'wangtongtong'   // 正确
x[3] = true    // 错误，布尔类型不是number和string的联合类型

6. 枚举：enum

// 数字的枚举
enum Color {
    
    Red,Green,Blue}  // 默认是从0开始，逐个递增
let c: Color = Color.Green;   // 1

enum Color {
    
    Red = 1,Green,Blue}  // 可以指定开始的数字，后面也是逐个递增
let c: Color = Color.Green;   // 2

enum Color {
    
    Red = 1,Green = 4,Blue = 8}   // 可以全部手动指定

// 字符串的枚举，后面必须都要指定，否则报错
enum Sex{
    
    male = '男',female = '女'}
let sex: Sex = Sex.female;    // 女

enum Sex{
    
    male = '男',female}   // female必须指定，否则报错

// 通过枚举的值反推映射的名字
enum Color {
    
    Red = 1, Green, Blue}
let colorName: string = Color[2];  // Green

7. any类型：表示任一类型，当不清楚变量类型，不希望类型检查器对这些值进行检查而是直接让他们通过编译阶段的检查

const name: any = 'wangjiajia'

8. void类型：和any类型相反，表示没有任何类型，一般用于一个函数没有返回值。

function warnUser(): void {
    
    
    console.log("This is my warning message");
}
// 声明一个void类型的变量没有么意义，因为只能赋值undefined和null
const name: viod = undefined
const name: viod = null

9. null和undefined：两者有各自的类型，默认是所有类型的子类型

let u: undefined = undefined;
let n: null = null;
let name: string = undefined | null

10. never类型：表示那些永不存在的值的类型，never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型；never类型是任何类型的子类型，也可以赋值给任何类型，没有类型是never的子类型或可以赋值给never类型，即使是any也不可以赋值给never。

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
    
    
    throw new Error(message);
}

// 推断的返回值类型为never
function fail() {
    
    
    return error("Something failed");
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
    
    
    while (true) {
    
    
    }
}

let name: never
let age: any = 18
name = age  // any类型也不可以赋值给never类型 

三. 类型断言

1. <类型>值（不能在TSX中使用）

let name: any = "this is a string";
// 将name断言成string类型
let nameLength: number = (<string>someValue).length;

2. 值 as 类型

let name: any = "this is a string";
// 将name断言成string类型
let nameLength: number = (someValue as string).length;

3. 变量!：表示断言这个变量不为null或者undefined

name! 断言name不为null或者undefined

四. 类型别名

1. 通过type定义：

type user = {
    
    
	name: string,
	age: number
}
// 类型扩展
type user2 = user & {
    
    
	address: string
}

2. 通过interface定义

interface user {
    
    
	name: string,
	age: number
}

// 类型扩展方法一：
interface user2 extends user {
    
    
	address: string
}

// 类型扩展方法二：同名叠加
interface user {
    
    
	name: string,
	age: number,
	address: string
}

3. type和interface的区别：type一旦定义之后就不能在添加新的属性，而interface总是可以扩展的。

五. 只读属性

interface user {
    
    
	readonly name: string,  // name是只读属性，不可以操作
	age: number
}

interface user {
    
    
	readonly name: string,  // name是只读属性，不可以操作
	age: number,
	readonly userInfo: {
    
       // userInfo是只读属性，不可以操作,但是可以操作userInfo下面的address属性
		address:'string'
	}
}

六. 泛型

// 定义一个泛型函数
function actionFun<T>(arg:T) :T{
    
    }  // T帮助我们捕获用户在调用函数的时候传入的参数类型

// 使用
let output = actionFun<string>("myString");
// 或者直接写，因为编译器会帮助我们做类型推断
let output = actionFun("myString");

// 泛型约束
function actionFun<T>(arg:T) :T{
    
    
	console.log(arg.length)  // 报错，传入的参数不一定具有length属性
}

// 解决办法
interface Lengthwise {
    
    
	length: number;
}
function actionFun<T extends Lengthwise>(arg:T) :T{
    
    
	console.log(arg.length)  // 报错，传入的参数不一定具有length属性
}
loggingIdentity(3)   // 报错，传入的参数必须包括length属性
loggingIdentity({
    
    length:10})    // 正确

// 在泛型约束中使用类型参数
function getProperty<T,K>(obj: T, key: K) {
    
    
    return obj[key];
}
let X = {
    
     a: 1, b: 2, c: 3, d: 4 };
getProperty(X,'a')  // 正确
getProperty(X,'m')  // 错误，在X中没有m这个键名