type
status
date
slug
summary
tags
category
icon
password
Edited
Sep 15, 2022 01:15 PM
Created
Aug 14, 2022 07:59 AM
环境搭建
安装typescript
安装完成后可以使用
tsc
指令来编译ts文件编译
手动编译
自动编译
TS编译器会自动监视文件的变化,并在文件发生变化时对文件进行重新编译
基础
类型 | 例子 | 描述 |
number | 1, -33, 2.5 | 任意数字 |
string | 'hi', "hi" | 任意字符串 |
boolean | true、false | 布尔值true或false |
字面量 | let color: 'red' | 'blue' | 'black'; | 限制变量的值就是该字面量的值 |
any | * | 任意类型 |
unknown | * | 类型安全的any |
void | 空值(undefined) | 没有值(或undefined) |
never | 没有值 | 不能是任何值 |
object | {name:'孙悟空'} | 任意的JS对象 |
array | [1,2,3]: number[] | 任意JS数组 |
元组tuple | [4,5] | 元素,TS新增类型,固定长度数组 |
enum | enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat}; | 枚举,TS中新增类型 |
联合类型 | let str: string | number; | 取值可以为多种类型中的一种 |
interface | interface Person {
name: string,
age?: number, // 可选属性
[propName: string]: any // 任意属性
readonly id: number, // 只读属性
} | 它是对行为的抽象,而具体如何行动需要由类去实现
(定义的变量比接口少或多了一些属性是不允许的) |
Function | (x: number, y: number) => number
(x: number, y: number) : number=> {}
剩余参数: ...rest:any[] | ㅤ |
大小写类型说明
永远不要使用类型的数字,字符串,布尔值或对象。这些类型是指在JavaScript代码中几乎从不使用的非原始装箱对象。
请使用类型数字,字符串和布尔值。
类型断言
用来手动指定一个值的类型
声明文件
引用它的声明文件,才能获得对应的代码补全、接口提示等功能
declare var
声明全局变量
declare function
声明全局方法
declare class
声明全局类
declare enum
声明全局枚举类型
declare namespace
声明(含有子属性的)全局对象
interface
和type
声明全局类型
export
导出变量
export namespace
导出(含有子属性的)对象
export default
ES6 默认导出
export =
commonjs 导出模块
export as namespace
UMD 库声明全局变量
declare global
扩展全局变量
declare module
扩展模块
/// <reference />
三斜线指令
声明语句
声明文件
通常我们会把声明语句放到一个单独的文件(
jQuery.d.ts
)中,这就是声明文件声明文件必需以
.d.ts
为后缀解析声明文件需要将声明文件引入
tsconfig.json
中的 files
、include
和 exclude
配置,确保包含了 .d.ts
文件interface
和 type
除了全局变量之外,可能有一些类型我们也希望能暴露出来。在类型声明文件中,我们可以直接使用
interface
或 type
来声明一个全局的接口或类型这样的话,在其他文件中也可以使用这个接口或类型了
进阶
类型别名
类型别名用来给一个类型起个新名字
使用
type
创建类型别名(类型别名常用于联合类型)类
- 类(Class):定义了一件事物的抽象特点,包含它的属性和方法
- 对象(Object):类的实例,通过
new
生成
- 面向对象(OOP)的三大特性:封装、继承、多态
- 封装(Encapsulation):将对数据的操作细节隐藏起来,只暴露对外的接口。外界调用端不需要(也不可能)知道细节,就能通过对外提供的接口来访问该对象,同时也保证了外界无法任意更改对象内部的数据
- 继承(Inheritance):子类继承父类,子类除了拥有父类的所有特性外,还有一些更具体的特性
- 多态(Polymorphism):由继承而产生了相关的不同的类,对同一个方法可以有不同的响应。比如
Cat
和Dog
都继承自Animal
,但是分别实现了自己的eat
方法。此时针对某一个实例,我们无需了解它是Cat
还是Dog
,就可以直接调用eat
方法,程序会自动判断出来应该如何执行eat
- 存取器(getter & setter):用以改变属性的读取和赋值行为
- 修饰符(Modifiers):修饰符是一些关键字,用于限定成员或类型的性质。比如
public
表示公有属性或方法
- 抽象类(Abstract Class):抽象类是供其他类继承的基类,抽象类不允许被实例化。抽象类中的抽象方法必须在子类中被实现
- 接口(Interfaces):不同类之间公有的属性或方法,可以抽象成一个接口。接口可以被类实现(implements)。一个类只能继承自另一个类,但是可以实现多个接口
使用
属性和方法
使用
class
定义类,使用 constructor
定义构造函数。通过
new
生成新实例的时候,会自动调用构造函数继承
使用
extends
关键字实现继承,子类中使用 super
关键字来调用父类的构造函数和方法存取器
使用
getter
和 setter
可以改变属性的赋值和读取行为静态方法
使用
static
修饰符修饰的方法称为静态方法,它们不需要实例化,而是直接通过类来调用实例属性
可以直接在类里面定义
静态属性
抽象类
abstract
用于定义抽象类和其中的抽象方法抽象类是不允许被实例化的
类与接口
实现(implements)是面向对象中的一个重要概念。一般来讲,一个类只能继承自另一个类,有时候不同类之间可以有一些共有的特性,这时候就可以把特性提取成接口(interfaces),用
implements
关键字来实现。这个特性大大提高了面向对象的灵活性- 一个类可以实现多个接口
- 接口可以继承接口
接口继承类
当我们在声明
class Point
时,除了会创建一个名为 Point
的类之外,同时也创建了一个名为 Point
的类型(实例的类型)所以既可以将
Point
当做一个类来用也可以将 Point
当做一个类型来用泛型
泛型(Generics)是指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性
其中
<T>
就是泛型泛型可以有多个:
<T, U>
泛型约束
下例中,使用了
extends
约束了泛型 T
必须符合接口 Lengthwise
的形状,也就是必须包含 length
属性泛型接口
注意,此时在使用泛型接口的时候,需要定义泛型的类型
泛型参数的默认类型
声明合并
如果定义了两个相同名字的函数、接口或类,那么它们会合并成一个类型:
相当于:
注意,合并的属性的类型必须是唯一的(属性名可以重复,但类型必须一致)
参考链接:
- 作者:JinSo
- 链接:https://jinso365.top/article/ts-intro
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议,转载请注明出处。