简介
它是 JavaScript 的超集，具有静态类型检查和面向对象编程的特性。TypeScript 的出现，为开发者提供了一种更加严谨和高效的开发方式。
主要特点：
- 、静态类型检查。
通过静态类型检查，开发者可以在编译时发现错误，而不是在运行时。这有助于减少调试时间，提高代码质量。TypeScript 支持多种类型注解，包括基本类型（如 number、string、boolean 等）、数组、元组、枚举、接口、类等。
- 面向对象编程
支持类、接口、继承、多态等面向对象编程的核心概念。开发者可以使用 TypeScript 编写更具结构性和模块化的代码，提高代码的复用性和可维护性。此外，TypeScript 还支持装饰器（Decorators），这是一种用于类和方法的元数据注解，可以用于实现依赖注入、日志记录、权限控制等功能。
基础类型
首先需要生成一个ts的配置文件
Tsc --init
使用 BigInt 等ES6新增的，需要在配置文件
lib中添加配置
"lib": [
"ES2022",
"dom"
],
- 布尔、数字、字符串
类型小写用于基本类型，大写的类型都是包装类（实例对象等）
let name:string = "smz"
let age:number = 18
let handsome:boolean = true
- 数组
let arr1: number[] = [1, 2, 3]
let arr2: Array<number> = [1, 2, 3]
let arr3: (number | string)[]= [1, 2, 3, '4']
let arr4: Array<number | string> = [1, 2, 3, '4']
- 元组
规定长度和存储的类型
添加只能添加元组中存在的类型，但是不能调用，因为不确定是否存在这个值
let tuple1: [number, string, boolean] = [1, '2', true]
tuple1.push(1)
tuple1.push('3')
tuple1.push(false)
// tuple1[3] // 不能使用后添加的值
- 枚举
自带类型的对象,自动增长，数字类型的枚举 可以反举，可以直接赋值，后面的会根据上一个自动推断自身值
知道名称，不知道值： const enum<名称> {}
使用：<枚举名称>.<名称>
知道值，不知道名称（反举）：enum <名称> {}
使用： <枚举名称>[<值>]
enum UserType {
Admin,
User,
Guest
}
console.log(UserType.Admin)
enum UserType2 {
Admin = 0,
User= 1,
Guest = 2
}
let userItem:string = UserType2[1]
console.log(userItem)
- any
任意值
在不清楚是什么类型的时候用 any
let notSure: any = 4;
notSure.toFixed();
- Object
所有
与any类似，但是 Object 类型的变量不允许调用任何方法，有也并不能调用
let prettySure: Object = 4;
prettySure.toFixed(); // Property 'toFixed' does not exist on type 'Object'.
- void
空值
表示没有任何类型，当函数没有返回值时，使用void
function warnUser(): void {
alert("This is my warning message");
}
- Undefined 和 Null
Undefined :不存在以后也不存在 Null:不存在以后可能存在
let u: undefined = undefined;
let n: null = null;
- never
永不存在类型
never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型；可以用来做代码完整性检测
function error(message: string): never {
throw new Error(message);
}
function infiniteLoop(): never {
while (true) {
}
}
// 类型保护
function valiData(val: string | number) {}
function getResult(srtgrOrNum: string | number | boolean){
if (typeof srtgrOrNum ==='string') {
return srtgrOrNum;
}
if (typeof srtgrOrNum === 'number') {
return srtgrOrNum;
}
// if (typeof srtgrOrNum === 'boolean') {
// return srtgrOrNum;
// }
// 永远不能到达这一步，到这一步说明方法缺失逻辑
valiData(srtgrOrNum) // Argument of type 'string | number | boolean' is not assignable to parameter of type 'never'. Type 'string' is not assignable to type 'never'.
}
- Symbol
永远唯一
let symbol1:symbol = Symbol("1")
let symbol2:symbol = Symbol("1")
console.log(symbol1 === symbol2) // false
let symbol3:symbol = Symbol.for("1") // 根据key找
console.log(symbol1 === symbol3) // true
- BigInt
长整型
let b1:bigint = BigInt(Number.MAX_SAFE_INTEGER + 100000)
console.log(b1)
类型推断
- 基本
在有些没有明确指出类型的地方，类型推论会帮助提供类型
let a = 1
let y ='2'
let z = true
- 最佳通用类型
需要从几个表达式中推断类型时候，会使用这些表达式的类型来推断出一个最合适的通用类型
let x = [0, 1, null];
- 上下文类型
TypeScript类型推论也可能按照相反的方向进行。 这被叫做“按上下文归类”。按上下文归类会发生在表达式的类型与所处的位置相关时。
window.onmousedown = function(mouseEvent) {
console.log(mouseEvent.button);
};
window.onmousedown = function(mouseEvent: any) {
console.log(mouseEvent.button);
};
- 联合类型
联合类型的变量只能访问公共方法，除非在使用方法前对变量已经赋值了。
let name: string | number ;
name.toFixed();
类型定义
使用 type 关键字定义自己的类型
type Person = '男' | '女' | '其它'
let person: Person = '男'
也可以通过对象属性和联合类型做互斥（可辨识联合类型）
type Person2 =
{
weal: true,
waste: string
}
|
{
weal: false,
waste: number
}
let person2: Person2 = {
weal: true,
waste: '123'
}
let person3: Person2 = {
weal: false,
waste: 123
}
断言
断言就是，让代码绕过TS检查
- 非空断言
指定其不可能为空
let ele = document.getElementById('app')
// 方式1
ele!.style.color ='red'
// as 断言
(ele as HTMLDivElement).style.color ='red'
- 双重断言
将某个值通常断言成 any 再断言成 其他类型，any类型可以赋值给任何类型
let str: string | number
let boo = (str! as any) as boolean
