20分钟学会TypeScript
在B站看的【吴悠讲编程】的课程《20分钟学会TypeScript 无废话速成TS》,全长只有20分钟,真的是极致简单的入门视频,用这个专栏记录一下学习笔记。
目录
1 必备概念
1.1 typescript使用方式
1.2 typescript介绍
2 类型推断
3 类型注解
4 类型断言
5 基础类型和联合类型
6.1 数组
6.2 元组
6.3 枚举
6.4 其他
7 函数
8 接口
9 类型别名
10 泛型
1 必备概念
1.1 typescript使用方式
- 本地下载使用:npm i typescript -g
- 在typescript官网:演练场playground
1.2 typescript介绍
javascript本身是弱类型脚本语言,本身使用起来是非常灵活的,但是当项目体量比较大的时候,这种灵活的编程方式不利于后期代码维护,由此,typescript应运而生。
2 类型推断
typescript会根据给变量存放的初始值进行变量类型限定。
let str = \'abc\'str = 10 //错误,str以后只能存放字符串值
3 类型注解
一般不建议使用类型推断,会使用类型限定,会通过冒号进行类型限定。
let str: string = \'abc\'//或者是:let str: string //可以初始时不给值,做一个预声明str = \'abc\'
4 类型断言
let numArr = [1, 2, 3]const result = numArr.find(item => item > 2) as number //人工干预,断言result为number类型result * 5
5 基础类型和联合类型
一般有字符串string、数值型number、布尔型bool
let v1: string = \'abc\'let v2: numbe = 10let v3: boolean = trueley nu: null = nulllet un: undefined = undefinedlet v4: string | null = nulllet v5: 1 | 2 | 3 = 2
6 数组、元祖、枚举等
6.1 数组
有以下两种声明方式:
let arr: number[] = [1, 2, 3]let arr1: Array = [\'a\', \'b\', \'c\']
6.2 元组
元组也可以存储数据,但是限定了存储的数据个数,以及每个数据类型。
let t1: [number, string, number] = [1, \'a\', 2]t1[0] = 100t1[1] = \'b\'let t2: [number, string, number?] = [1, \'a\']
6.3 枚举
enum MyEnum { A, B, C}//访问方式console.log(MyEnum.A)console.log(MyEnum[0])
6.4 其他
严格模式下,void只能被分配undefined值
void
7 函数
function MyFn (a = 10, b = number, c?: string, ...rest: number[]): number { return 100}const f = MyFn(20, 100, \'abc\', 1, 2, 3)
8 接口
接口interface通常用于对象的定义。
interface Obj { name: string, age: number}const obj1: Obj = { name: \'a\', age: 10}const obj2: Obj = { name: \'b\', age: 20}
9 类型别名
type MyUserName = string | numberlet a: MyUserName = 10
10 泛型
function myFn(a: T, b: T): T[] { return [a, b]}myFn(1, 2)myFn(\'a\', \'b\')myFn(\'a\', \'b\')