1.類Class
概念：定義了一切事物的抽象特點
對象：類的實例
面向對象三大特性：封裝繼承多態
1）構建動物類
class Animal{
name: string;
static categories: string[] = ['mamba', 'google'];
// 構造器
constructor(name: string){
this.name = name;
}
// 靜態方法
static isAnimal(a){
return a instanceof Animal
}
// 方法
run(){
return `${this.name} is running`
}
}
// 實例化
const snake = new Animal('snake');
console.log(snake.run()); // 對象點方法
console.log('靜態屬性',Animal.categories); // 類名點屬性名
2）構建其繼承
class Dog extends Animal{ // 繼承
bark(){ // 繼承之後增加的方法
return `${this.name} is barking`;
}
}
const xiaohuang = new Dog('xiaohuang');// 實例化對象小黃
console.log(xiaohuang.run());
console.log(xiaohuang.bark());
3）繼承之後實現方法的重寫
class Cat extends Animal{
constructor(name){
super(name);
}
run(){ // 重寫run方法
return 'Mamba，' + super.run();
}
}
const maomao = new Cat('maomao'); // 實例化Cat類爲maomao
console.log(maomao.run());
4）修飾符public private protected
說明：private 設置屬性或方法只能自己類中訪問，其子類也不行
protected其子類可以訪問
public 公開
2.接口interface
對對象的形狀（shape）進行描述
對類（class）進行抽象
Duck Typing鴨子類型
1）定義接口用類來實現
interface Radio{
switchRadio(): void;
}
interface Battery{
checkBatteryStatus(): void;
}
// 類實現
class Car implements Radio{
switchRadio(){
console.log(123);
}
}
// 多實現
class Cellphone implements Radio, Battery{
switchRadio(){
console.log(123);
}
checkBatteryStatus(){
console.log(54555);
}
}
2）設置接口屬性
interface Person{
readonly id: number; // 只讀屬性，定義時候賦值，不能修改
name: string;
age?: number; // ?表示可選屬性
}
// 常規屬性必須添加，可選屬性沒必要添加，只讀屬性必須定義時候賦值
let mamba: Person = {
id: 1,
name: 'mamba',
age: 20
}
// mamba.id = 2; 報錯，只讀屬性不能修改
// const 定義常量 readonly 用在屬性上
// const a:number = 2;
// a = 3; // 這裏會報錯
3.枚舉enum
enum Direction{
Up = 'UP';
Down = 'DOWN';
Left = 'LEFT';
Right = 'RIGHT';
}
const value = 'UP';
if(value === Direction.Up){
console.log('go up!');
}
console.log(Direction.Up);
4.泛型
說明：泛型是指在定義函數 接口或類的時候，不預先指定具體的類型，而在使用的時候再指定類型的一種特性。
1）定義格式
function echo<T>(arg: T): T{
return arg;
}
// 會發生類型推論
// 給你定義const result:string
// 根據傳遞的值可以得出如：數字number就會變成number類型
const result = echo('mamba');
2）定義多個參數,元組
function swap<T, U>(tuple:[T, U]): [U, T]{
return [tuple[1], tuple[0]];
}
const result2 = swap(['string', 123]); // 類型推論，T是string類型 U是number類型
console.log(result2[0]);
function echoWithArr<T>(arg: T[]): T[]{
console.log(arg.length);
return arg;
}
const arr2 = echoWithArr([1, 2, 3]); // 類型推論，是個number類型的數組
3）約束泛型
// 說明：約束有length這個屬性
interface IWithLength{
length: number
}
function echoWithLength<T extends IWithLength>(arg: T): T{
console.log(arg.length);
return arg;
}
const str = echoWithLength('str');
const obj = echoWithLength({length: 10});
const arr2 = echoWithLength([1, 2, 3]);
console.log('##################');
4）定義類的泛型
class Queue<T>{
private data = [];
push(item: T){
return this.data.push(item);
}
pop(): T{
return this.data.shift();
}
}
const queue = new Queue<number>();
queue.push(1);
console.log(queue.pop().toFixed());
const queue2 = new Queue<string>();
queue2.push('str');
console.log(queue2.pop().length);
5）接口泛型
interface KeyPair<T, U>{
key: T;
value: U;
}
let kp1: KeyPair<number, string> = {key: 123, value: 'str'};
let kp2: KeyPair<string, number> = {key: 'str', value: 456};
let arr: number[] = [1, 2, 3];
// 泛型
let arrTwo: Array<number> = [1, 2, 3];
// 定義接口
interface IPlus<T>{
(a: T, b: T): T
}
function plus(a: number, b: number): number{
return a + b;
}
function connect(a: string, b: string): string{
return a + b;
}
const a: IPlus<number> = plus;
const b: IPlus<string> = connect;
5.類型別名
type PlusType = (x: number, y: number) => number;
function sum(x: number, y: number): number{
return x + y;
}
const sum2: PlusType = sum;
type NameResolver = () => string;
type NameOrResolver = string | NameResolver;
function getName(n: NameOrResolver): string{
if(typeof n === 'string'){
return n;
}else{
return n();
}
}
6.類型斷言
說明：斷言必須存在一種類型
function getLength(input: string | number): number{
const str = input as String;
if(str.length){
return str.length;
}else{
const number = input as Number;
return number.toString().length;
}
// 另外一種寫法
if((<String>input).length){
return (<string>input).length;
}else{
return input.toString().length;
}
}