类型
number、string、boolean、undefined、null、symbol、enum
const num: number = 1;
const str: string = 'string';
const bool: boolean = true;
const undef: undefined = undefined;
const nu: null = null;
const symb: symbol = Symbol('symbol').valueOf();
enum Days { Sun, Mon, Tue, Wed, Thu, Fri, Sat };
Array
const array1: Array<number> = [1];
const array2: number[] = [1];
Function
const fn: Function = () => {};
interface 、 type 接口、 别名
interface Inter {
name: string;
age?: number;
[key: string]: unknown;
}
type InterType = Inter & { sex: string };
as、 <> 断言
const array4: Array<string> = ['string'];
const arrItem: unknown = 1;
array4.push(arrItem as string);
const object = {} as Inter;
| 联合
const array5: Array<number | string> = [1, 'string'];
class
class Point {
x: number;
y: number;
constructor(x: number, y: number);
}
class MsgError extends Error {
constructor(m: string) {
super(m);
}
}
泛型
function identity<T>(arg: T): T {
return arg;
}
extends 约束
type range = number | string | boolean;
type func<T extends string> = (arg: T) => T;
keyof 索引
type Point = { x: number; y: number };
type P = keyof Point;
in 映射
type Readonly<T> = {
readonly [P in keyof T]: T[P];
};
常用内置泛型
ts声明文件：typescript\lib\lib.es5.d.ts
/**
* Make all properties in T optional 所有属性均为可选属性
*/
type Partial<T> = {
[P in keyof T]?: T[P];
};
/**
* Make all properties in T required 所有属性均为必须属性
*/
type Required<T> = {
[P in keyof T]-?: T[P];
};
/**
* Make all properties in T readonly 所有属性均为只读属性
*/
type Readonly<T> = {
readonly [P in keyof T]: T[P];
};
/**
* From T, pick a set of properties whose keys are in the union K
* K类型约束为T键值
*/
type Pick<T, K extends keyof T> = {
[P in K]: T[P];
};
const p: Pick<k, {name: string; age: number;}>
eg: const p: Pick<{name: string; age: number; sex: string}, 'name' | 'age'> = {
name: 'name',
age: 18
};
/**
* Construct a type with a set of properties K of type T
*/
type Record<K extends keyof any, T> = {
[P in K]: T;
};
eg: const p: Record<string, string> = {
name: 'name',
9: '9'
};
/**
* Exclude from T those types that are assignable to U
* 排除 T 不同于 U
*/
type Exclude<T, U> = T extends U ? never : T;
eg: const p: Exclude<keyof {name: string; age: number;}, keyof {name: string;}> = 'age';
/**
* Extract from T those types that are assignable to U
* 提取 T 相同于 U
*/
type Extract<T, U> = T extends U ? T : never;
eg:const p: Extract<keyof {name: string; age: number;}, keyof {name: string;}> = 'name';
/**
* Construct a type with the properties of T except for those in type K.
* 排除 T的属性
*/
type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;
eg: const p: Omit<{name: string; age: number; sex: string}, 'name' | 'age'> = {
sex: 'name'
};
DOM CSS
ts声明文件：typescript\lib\lib.dom.d.ts
HTML接口：HTMLElementTagNameMap
CSS接口：CSSStyleDeclaration
function clickHandle(event: Event) {
const dataset = (p.currentTarget as HTMLElement).dataset;
}
// Partial 把 CSSStyleDeclaration 转为可选属性
const style: Partial<CSSStyleDeclaration> = {
padding: '0'
};
