TS 的语法 – 源码巴士

1. `typeScript` 中的数据类型

typeScript 中为了使编写大代码更规范，更利于维护，增加了类型效验，在ts中为我们提供了以下类型
布尔类型：boolean
数字类型：number
字符串类型：string
数组类型：array
元组类型：tuple
枚举类型：enum
任意类型：any
其它类型：null 、undefined、void 、never

2. `typeScript` 中变量的类型限定

布尔类型：boolean

let flag : boolean = true
flag = '张三'  // 错误，只允许赋 boolean 值
flag = false   // 正确

数字类型：number

let num : number = 123
num = 456
// 只允许赋 number 值，包含小数、整数

字符串类型：string
```
let str : string = 'haha'
str = 'hehe'
```

数组类型：array

// 1. 第一种定义数组方式
let arr : number[] = [10, 20, 30]  
// 2. 第二种定义数组方式
let arr : Array<number> = [10, 20, 30]
// 3. 第三种定义数组方式
let arr : any[] = [10, 'hah', true]
// 数组可以先到任意类型

元组类型：tuple

// 元组类型，属于数组的一种
let arr : [string,number,boolean] = ['ts', 123, true]
// 按照前面的类型限定的顺序赋对应类型的值

枚举类型：enum

// 枚举类型的定义
enum Flag {success=1, error=-1}
let f : Flag = Flag.success
console.log(f)
// f 打印的值为 1
// 如果枚举中的标识符 success、error 没有赋值，那么默认值为它们的索引
// 如果枚举标识符中前面的赋了数字值，后面的没有赋值，后面的默认值为前面的值+1

任意类型：any

let num : any = 123
num = 'hah'
// 任意类型，可以赋任意类型的值
// 任意类型，可以用来接收 Object 类型对象

类型：undefined

let num : number // 定义了变量没赋值就是undefined，但是限定的类型 number 这样就会报错
let num : number | undefined  // 这样就不会报错，可以是 number 类型也可以是 undefined 类型

类型：null

// null 跟 undefined 差不多用法
let num : number | null | undefined
// 可以是 number 也可以是 null 也可以是 undefined

类型：void

// void 表示没有任何类型，一般用于定义方法的时候，方法没有返回值
function run() : void {
	console.log('表示方法没有返会任何类型')
}
// 如果有返回值比如：
function run() : number {
	return 123
}

类型：never

// never 类型：是其它类型（包括 null 和 undefined）的子类型，代表从不会出现的值
// 这意味着声明 never 的变量只能被 never 类型所赋值
// 比如：
let a : never = (() => {
	throw new Error('错误')
})()
// 接收抛出的异常，一般很少用

3. `typeScript` 中的函数

3.1 函数的定义

限定函数的返回值类型：

function getInfo() : string {
	return '哈哈'
}
// 返回值必须跟限定类型的一致

限定函数的参数类型：

function getInfo(name:string, age:number) {
	// 函数在调用的时候，传递的参数必须按照限定的类型一一对应
}

没有返回值：
```
function getInfo() : vaid {
	
}
```

可选参数：

function getInfo(name:string, age?:number) {
	// name 必须穿， age 可以不传，因为加了 ? 号
}
// 注意：可选参数写在后面

默认参数：

function getInfo(name:string, age:number=20) {
	// age 如果不传就使用默认值
}
// 默认参数放在前面、后面都可以

剩余参数：

function getInfo(num:number, ...arr:number[]) : number {
	arr.forEach(ele => {
		return num+=ele
	})
}
getInfo(1,2,3,4,5)
// 1 传给了 num, 剩余的参数传给了 arr ，arr是一个数组

3.2 函数的定义方式

函数声明：

function add(num1:number, num2:number) :number {
	return num1 + num2
}

函数表达式：

let add = function(num1:number, num2:number) :number {
	return num1 + num2
}

箭头函数：

let add = (num1:number, num2:number) :number {
	return num1 + num2
}
// 注意：箭头函数不绑定 this

4. TS 中的类`class`

4.1 类的声明

类的声明：

class Prose {
	// 1. 类中的成员name、age、say
	name:string
    age:number 
    // 2. constructor 为类中的构造函数，每个类都必须有
	constructor(name:string, age:number) {
		// 创造实例的时候为类中成员赋值
    	this.name = name
   		this.age = age
    }
	
	// 3. 类中的成员 sya 方法
 	say() {
  		console.log(`大家好我是${this.name}`)
	}
}

创建类的实例：

// 在 new 实例的时候，需要传递初始化参数
let p1:Prose = new Prose('张三', 18)

4.2 类中的修饰符

权限修饰符：

public  // 公有的，类、子类、实例都可以访问
protected // 受保护，只有在类、子类中可以访问
private // 只在类中可以访问

只读修饰符

readonly // 只读修饰符，不能修改

4.3 类的继承`extends`

父类声明

// 父类
class Proses {
	name: string
	age: number
	// 构造函数
	constructor(name:string, age:number) {
		this.name = name
		this.age = age
	}
}

子类继承：

class Prose extends Proses {
	sex:string
	// 构造函数
	constructor(sex:string, name:string, age:number) {
		super(name,age)  // 在子类的构造函数中必须先写上 super ，为父类的构造函数传值
		this.sex = sex
	}
}
// 继承之后，子类就拥有父类的成员了

5. 接口`interface`

接口的声明

interface Prose {
	name:string
	age:number
}

接口的实现：

let p1:Prose = {
	name:'张三',
	age: 18
}
// 接口的实现必须遵循，接口中定义的规则来实现

接口申明函数

// 1. 申明：
interface Prose {
	// 接口规定了参数，和返回值的类型
	(name:string, str:string):boolean
}
// 2. 实现：
let p1:Prose = function(name:string, str:string):boolean {
	return (name.search(str) !== -1)
}

原文链接：https://blog.csdn.net/weixin_44908855/article/details/109584806

1. typeScript 中的数据类型

2. typeScript 中变量的类型限定

3. typeScript 中的函数