【记录】TypeScript

配置

// tsc --init
// tsconfig.json
{
    
	// **表示任意目录，*任意文件
	"include": [
		"./src/**/*"
	],
	"exclude": [
		"./node_modules"
	],
	"compilerOptions": {
    
		// 指定编译成哪个es版本
		"target": "ES5",
		// 指定模块化规范(es6、commonjs)
		"module": "es6",
		// 指定项目中要使用的库
		//"lib": [],
		// 编译后文件所在的目录
		"outDir": "./dist",
		// 把编译后的文件合并为一个文件
		//"outFile": "./dist/app.js"
		// 是否对js文件进行编译
		"allowJs": false,
		// 是否检查js代码是否符合语法规范
		"checkJs": false,
		// 是否移除注释
		"removeComments": true,
		// 不生成编译后的文件
		//"noEmit": true
		// 当有错误时不生成编译文件
		"noEmitOnError": true,
		// 整合
		"strict": false,
		// 是否开启strict模式
		"alwaysStrict": false,
		// 不允许隐式any
		"noImplictAny": true
		// 不允许不明确类型的this
		"noInplictThis": true,
		// 严格地检查空值
		"strictNullCheck": true,
	}
}

类型声明

let a: number;

// 如果声明的时候赋值了，ts自动对变量进行类型检测。
let c = false;
c = true;
c = 123;// 报错

function sum(a: number, b: number): number{
    
	return a + b;
}

// 使用字面量进行类型声明，联合类型
let b: "male" | "female";
b = "male";
b = "famale";

类型

number
string
boolean

字面量
any
unknown
void

• 不返回结果/null/undefined。

never

• 永远不会返回结果。

object
array
tuple
enum

// any可以赋值给任意变量。
let d: any;
d = true;
let s: string;
s = d;

// unknown是一个类型安全的any，不能直接赋值给其他变量。
let e: unknown;
e = 'str';
s = e; // 报错

// 类型断言：告诉解析器变量的实际类型。
s = e as string;
s = <string>e;

let a: obeject;
// 一般用{}来指定对象中可以包含哪些属性。必须只包含{}里的属性。
let b: {
    name: string};
b = {
    name: 'swk'};
b = {
    name: 'swk', age: 18};// 报错
// ?表示有也行，没有也行。
let c: {
    name: string, age?:number};
c = {
    name: 'swk', age: 18};
// 表示name必须是string，其他无所谓。
let d: {
    name: string, [propName: string]: any};

let a: string[];
let b: Array<number>;

// tuple元组：固定长度的数组。
let a: [string, string];

// enum枚举。
Enum Gender{
    
	Male = 0,
	Female = 1
}
let i = {
    name: string, gender: Gender};
i = {
    
	name: 'swk',
	gender: Gender.Male
}
console.log(i.gender === Gender.Male);

// &表示两个都得满足。 
let j: {
    name: string}&{
    age: number};
j = {
    name: 'swk', age: 18};

// 类型的别名。
type myType = 1 | 2 | 3;
let m: myType;

类

class Person{
    
	// 实例属性：需要通过对象的实例去访问。person.name
	// 公共属性public：在任何地方都可以访问修改。（子类也可以
	name: string = 'swk';
	// 私有属性private：只能在类内部访问修改。（子类不可以
	private _gender: string;
	// protected：只能在类和子类内部访问修改。
	
	// 静态属性（类属性）static：可以直接通过类去访问。Person.age
	static age: number = 18;
	// 只读属性readonly：无法修改。
	//readonly name: string = 'swk';
	//static readonly name: string = 'swk';
	
	// 实例方法
	sayHello(){
    
		...
	}
	// 类方法
	static say(){
    
		...
	}	
		
	//getGender(){
    
	// return this._gender;
	//}
	//setGender(value: string){
    
	// this._gender = value;
	//}
	get gender(){
    
		return this._gender;
	}
	set gender(value: string){
    
		this._gender = value;
	}
}
		
const per = new Person('swk', 'male', 18);
console.log(per.gender);
		
		
class Dog{
    
	name: string;
	age: number;
	constructor(name: string, age: number){
    
		this.name = name;
		this.age = age;
	}
	bark(){
    
		...
	}
}
	
	
class C{
    
	name: string;
	age: number;
	constructor(name: string, age: number){
    
		this.name = name;
		this.age = age;
	}
}
//等同于
class C{
    
	constructor(public name: string, public age: number){
    
		
	}
}

继承

class Animal{
    
	name: string;
	constructor(name: string){
    
		this.name = name;
	}
	sayHello(){
    
		...
	}
}
class Dog extend Animal{
    
	age: number;
	constructor(name: string, age: number){
    
		// super表示当前类的父类。
		super(name);
		this.age = age;
	}

}

抽象类

不能用来创建对象。（专门用来被继承的类）

abstract class Animal{
    
	name: string;
	constructor(name: string){
    
		this.name = name;
	}
	// 抽象方法：只能定义在抽象类中，没有方法体，子类必须对抽象方法进行重写。
	abstract sayHello(): void;
}

接口

用来定义一个类结构，定义规范。

// 和type类似。type不能重复声明。
// 接口可以重复声明，合并。
interface myInterface{
    
	name: string;
	age: number;
}
interface myInterface{
    
	gender: string;
}
const obj: myInterface = {
    
	name: 'sss',
	age: 111,
	gender: 'male'
};


// 接口中的属性和方法都不能有实际的值，接口中的方法都是抽象方法。
interface myInter{
    
	name: string;
	sayHello(): void;
}
class myClass implements myInter{
    
	name: string;
	constructor(name: string){
    
		this.name = name;
	}
	sayHello(){
    
		console.log('dasdasd');
	}
}

泛型

定义类型或者类时，不确定类型时可以使用泛型。

// 类型T只有在函数执行的时候才知道具体是什么类型。（用any会跳过类型检查）
function fn<T>(a: T): T{
    
	return a;
}
// 自动检测类型。
let res1 = fn(10);
// 手动指定类型。
let res2 = fn<string>('hello');

function fn2<T, K>(a: T, b: K):T{
    
	return a;
}

interface myInter{
    
	length: number;
}
function fn3<T extends myInter>(a: T): number{
    
	return a.length;
}


class MyClass<T>{
    
	name: T;
	constructor(name: T){
    
		this.name = name;
	}
}
const m = new Myclass<string>('swk');