Interfaces

Interfaces hebben geen runtime JS impact. TypeScript-interfaces hebben veel mogelijkheden om de structuur van variabelen te declareren.

De volgende twee zijn gelijkwaardige declaraties, de eerste gebruikt een inline annotatie, de tweede gebruikt een interface:

// Sample A
declare var myPoint: { x: number; y: number; };
// Sample B
interface Point {
 x: number; y: number;
}
declare var myPoint: Point;

Het mooie van Voorbeeld B is echter dat als iemand een bibliotheek maakt die voortbouwt op de myPoint-bibliotheek om nieuwe leden toe te voegen, hij die eenvoudig kan toevoegen aan de bestaande declaratie van myPoint:

// Lib a.d.ts
interface Point {
 x: number; y: number;
}
declare var myPoint: Point;
// Lib b.d.ts
interface Point {
 z: number;
}
// Your code
var myPoint.z; // Allowed!

Dit komt omdat interfaces in TypeScript open ended zijn. Dit is een essentieel kenmerk van TypeScript dat het mogelijk maakt om de uitbreidbaarheid van JavaScript na te bootsen met behulp van interfaces.

Klassen kunnen interfaces implementeren

Als u klassen wilt gebruiken die een objectstructuur moeten volgen die iemand voor u in een interface heeft gedeclareerd, kunt u het implements-sleutelwoord gebruiken om compatibiliteit te garanderen:

interface Point {
 x: number; y: number;
}
class MyPoint implements Point {
 x: number; y: number; // Same as Point
}

Basically in the presence of that implements, any changes in that external Point interface will result in a compile error in your code base so you can easily keep it in sync:

interface Point {
 x: number; y: number;
 z: number; // New member
}
class MyPoint implements Point { // ERROR : missing member `z`
 x: number; y: number;
}

Note that implements restricts the structure of the class instances i.e.:

var foo: Point = new MyPoint();

En dingen als foo: Point = MyPoint is niet hetzelfde.

Niet elke interface is eenvoudig implementeerbaar

Interfaces zijn ontworpen om elke willekeurig gekke structuur te verklaren die in JavaScript aanwezig zou kunnen zijn.

Bedenk de volgende interface waarbij iets oproepbaar is met new:

interface Crazy {
 new (): {
 hello: number
 };
}

Je zou in wezen iets hebben als:

class CrazyClass implements Crazy {
 constructor() {
 return { hello: 123 };
 }
}
// Because
const crazy = new CrazyClass(); // crazy would be {hello:123}

Je kunt alle gekke JS die er is declareren met interfaces en ze zelfs veilig gebruiken vanuit TypeScript. Dat wil niet zeggen dat je TypeScript-klassen kunt gebruiken om ze te implementeren.