关于前端:现代TypeScript高级教程接口和类

41次阅读

共计 2020 个字符,预计需要花费 6 分钟才能阅读完成。

点击在线浏览,体验更好 链接
古代 JavaScript 高级小册 链接
深入浅出 Dart 链接
古代 TypeScript 高级小册 链接

接口和类

在 TypeScript 中,接口(Interfaces)和类(Classes)是实现面向对象编程(Object-Oriented Programming,OOP)的根底工具。这些工具提供了一种形式来定义和组织简单的数据结构和行为。

接口

接口在 TypeScript 中扮演着要害的角色,用于强类型零碎的反对。接口能够形容对象的形态,使咱们能够编写出预期的行为。接口可用于形容对象、函数或者类的公共局部。

以下是一个根本的接口示例:

interface LabelledValue {label: string;}

function printLabel(labelledObj: LabelledValue) {console.log(labelledObj.label);
}

let myObj = {size: 10, label: "Size 10 Object"};
printLabel(myObj);

在这个例子中,LabelledValue接口就像一个名片,通知其余代码,只有一个对象有 label 属性,并且类型为string,那么就能够认为它是LabelledValue

接口也能够形容函数类型:

interface SearchFunc {(source: string, subString: string): boolean;
}

let mySearch: SearchFunc;
mySearch = function(src: string, sub: string): boolean {let result = src.search(sub);
  return result > -1;
}

此外,接口还能用于形容数组和索引类型:

interface StringArray {[index: number]: string;
}

let myArray: StringArray;
myArray = ["Bob", "Fred"];

interface Dictionary {[index: string]: string;
}

let myDict: Dictionary;
myDict = {"key": "value"};

与传统的 JavaScript 一样,TypeScript 也应用类(Classes)来定义对象的行为。然而,TypeScript 的类具备一些额定的个性,如拜访修饰符(Access Modifiers)、动态属性(Static Properties)、抽象类(Abstract Classes)等。

以下是一个根本的类示例:

class Greeter {
  greeting: string;
  constructor(message: string) {this.greeting = message;}
  greet() {return "Hello," + this.greeting;}
}

let greeter = new Greeter("world");

TypeScript 还引入了拜访修饰符 publicprivateprotected。如果没有指定拜访修饰符,则默认为 public

class Animal {
  private name: string;
  constructor(theName: string) {this.name = theName;}
}

TypeScript 类还反对继承,通过 extends 关键字能够创立一个子类。子类能够拜访和扭转父类的属性和办法:

class Animal {
  name: string;
  constructor(theName: string) {this.name = theName;}
  move(distanceInMeters: number = 0) {console.log(`${this.name} moved ${distanceInMeters}m.`);
  }
}

class Dog extends Animal {constructor(name: string) {super(name); }
  bark() {
    console.log('Wo

of! Woof!');
  }
}

const dog = new Dog('Tom');
dog.bark();
dog.move(10);
dog.bark();

为了实现多态,TypeScript 提供了抽象类的概念。抽象类是不能被实例化的类,只能作为其余类的基类。抽象类中能够定义形象办法,形象办法必须在派生类中实现:

abstract class Animal {abstract makeSound(): void;
  move(): void {console.log('roaming the earth...');
  }
}

class Dog extends Animal {makeSound() {console.log('Woof! Woof!');
  }
}

const myDog = new Dog();
myDog.makeSound();
myDog.move();

正文完
 0