谈谈TypeScript
关于 强类型 和 弱类型
关于 静态类型 和 动态类型
typescript 产生的背景
typescript 数据类型
关于「数据注解」
关于「函数重载」
什么是「接口」
interface 和 type 区别
什么是「泛型」
什么是「枚举类型」
什么是「类型断言」和「守卫」
1. 关于 强类型 和 弱类型？
- 第一点：划分角度 - 「类型安全」
- 第二点：定义：
// 强类型（java和python）：
1. 定义：语法上，限制「函数」的「实参」和「形参」类型必须保持一致，不允许有随意的隐式类型转换
2. 优势：
首先， 错误可更早暴露
其次， 提高开发效率
再次， 重构更牢靠（编译就会报错）
最后， 减少不必要的类型判断
// 弱类型（javascript）
1. 定义： 语法上，几乎没有什么约束， 允许有随意的「隐式类型转换」
2. 关于 静态类型 和 动态类型？
- 第一点： 划分角度 - 「类型检查」
- 第二点：定义
// 静态类型(typescript)
1. 定义： 编译阶段，明确「变量类型」且类型不允许再修改
// 动态类型 (javascript)
1. 定义： 执行阶段，明确「变量类型」且 「变量类型」随时可变化
3.typescript 产生的背景？
// javascript早期背景：
1. 应用简单，设计成「强类型」会冗余
2. js是脚本语言，无编译环节，静态类型需要编译
// 诞生：
1. 解决javascript「弱类型」的缺点，提高代码「可靠程度」
// 关于ts：
1. ts 是「微软」开发的
2. ts 是javascript超集，针对大型应用
3. ts 扩展了js的语法
4. ts 编译阶段检查错误(类型检查)
5. ts 提供丰富语法提示
6. 编译： tsc index.ts
4. typescript 数据类型
- js 数据类型
1.基本数据类型：Boolean, Number, String, Null, Undefined, Symbol
2.引用数据类型： Object(Array,Function)
- ts 数据类型
1. 基本数据类型：Boolean, Number, String, Null, Undefined, Symbol,「Any」,「Never」,「Void」, 「元组」，「枚举」， 「高级类型」
2. 对象： interface, type
3. 数组： boolean[], number[], string[], 泛型 Array<number>
4. 函数： function (a: number, b:string): number {} -> 入参 + 出参类型
5. 联合类型： Array<string | number>
6. 枚举类型
5. typescript 数据注解
- 作用： 类型声明， 不可以随意修改
- 语法：（变量/函数）：type
// I、基本数据类型：
let a: boolean = false
let b: number = 1
let c: string = '字符串'
let d: null = null
let f: undefined = undefined
let e: any = '任意类型'
function: test(): void {} // 函数无返回值
fucntion():nerver {} // 函数无法达到终点
// II、联合类型： 赋值时确认类型，取值为多个类型
let a: string | number ｜ boolean
// III、数组类型:
1. 语法： 类型[] （类型+方括号）
let arr1: number[] = [1, 2, 3]
let str1: string[] = ['6', '7']
let arr2: Array<number | string> = [1, '3']
let arr3: (number | string)[] = [1, '哈哈哈']
// IV、对象类型:
+ interface：对行为的抽象，首字母大写
interface Obj = {
name: string，
age?: number // ？: 可选属性
readonly id: number, // readonly: 只读属性
[propName:string]: any // 任意属性
}
type Obj1: Obj = {
name: string，
age: number
}
// V、函数： 函数声明
function per(a: number, b: number): number {
return a+b
}
// V、函数： 表达式
function biao: (a:number, b:number)=> {} = function(a, b) {
return a+b
}
6. 关于函数重载
- 定义： 同一个函数下，定义多种类型，可以将他们整合成一个函数
function person(name: string) {}
function person(name: boolean) {}
// 函数重载
function person(name: string | boolean) {}
7. 接口
- 定义
1. 对 「对象」形状的描述
interface Person = {
readonly id: number, // 只读属性
name: string,
age?: number // ？可选属性
[propName:string]: any // 任意属性
}
let per: Person = {
name: 'lll'
}
2. 对 「类」的一部分行为的抽象
interface Add {
(a: number, b:string) : number
}
let add: Add = (a, b) =>a+b
8. interface 和 type 区别？
- 相同点
1、都可以描述「对象」和 class
2、都允许扩展extends， type是&，接口是extends
- 不同点
1、 type 不支持继承
2、 type扩展是 &， 接口是 extends
3、声明方式： type-是赋值， 接口-是直接声明
4、重复声明： type-重名报错，接口-重名是最终合并在一起
5、声明类型： type-声明「任意类型」,接口-仅声明「类」和「对象」
9. 泛型
- 定义： 在定义函数/类/对象时，不明确的类型，用「T」来表示
function fanx<T>(canshu :T): T {}
fanx<Boolean>(true)
fanx<String>('111')
fanx(1010) // 自动解析成number
-
泛型约束： 利用extends
-
泛型工具类型：
1. typeof: 获取变量或属性的类型
2. keyof：获取某种类型的所有键
3. in: 遍历枚举类型
4. infer: 声明一个类型变量，并且对它进行使用
5. extends: 用于对泛型加以约束
10. 什么是枚举类型
定义： 一组「有名字」的常量集合
1. 枚举类型「只读」
enum Role = {
Teacher = 1,
Doctor = 2,
Worker = 2
}
11. 什么是类型断言和守卫
- 类型断言： 告诉编译器，不用检查，相信他就是这个类型
方式：尖括号<> 和 as
- 非空断言
方式： ！断言是非 null和undefined类型
- 确定赋值断言
方式： 类型！,明确会赋值
例如： let num! : numer
- 类型守卫: 执行时检查，确保该类型在一定范围内
1. in
2. typeof
3. interfaceof
4. is
