Was ist der Unterschied zwischen ‚erweitert‘ und ‚Geräte‘ in Typoskript

Question

Ich mag würde wissen, was Mann und Kind gemeinsam haben und wie sie sich unterscheiden.

class Person { 
    name: string; 
    age: number; 
} 
child extends Person {} 
man implements Person{} 

Answer 1

Die Dokumentation soll hier helfen:

Interfaces Extending Classes

Wenn ein Interface-Typ erstreckt sich eine Klassentyp es die Mitglieder von die Klasse erbt, aber nicht ihre Implementierungen. Es ist, als ob die Schnittstelle alle Mitglieder der Klasse deklariert hätte, ohne eine Implementierung bereitzustellen. Schnittstellen erben sogar die privaten und geschützten Mitglieder einer Basisklasse. Dies bedeutet, dass beim Erstellen einer Schnittstelle , die eine Klasse mit privaten oder geschützten Membern erweitert, diese Schnittstelle type nur von dieser Klasse oder einer Unterklasse davon implementiert werden kann.

Dies ist nützlich, wenn Sie eine große Vererbungshierarchie haben, aber angeben möchten, dass Ihr Code nur mit Unterklassen arbeitet, die bestimmte Eigenschaften haben. Die Unterklassen müssen nicht verwandt sein, außer von der Basisklasse zu erben. Zum Beispiel:

class Control { 
    private state: any; 
} 

interface SelectableControl extends Control { 
    select(): void; 
} 

class Button extends Control { 
    select() { } 
} 

class TextBox extends Control { 
    select() { } 
} 

class Image extends Control { 
} 

class Location { 
    select() { } 
} 

So, während

• extends bedeutet - es wird alles von dem übergeordneten
• implements in diesem Fall ist fast wie eine Schnittstelle zu implementieren. Child-Objekt kann so tun, als wäre es übergeordnet .. aber es wird keine Implementierung erhalten

Answer 2

In Typoskript (und einigen anderen OO-Sprachen) haben Sie Klassen und Schnittstellen.

Eine Schnittstelle hat keine Implementierung, es ist nur ein "Vertrag", welche Mitglieder/Methode dieser Typ hat.
Zum Beispiel:

interface Point { 
    x: number; 
    y: number; 
    distance(other: Point): number; 
} 

Instanzen, die diesen Point Schnittstelle implementieren müssen zwei Mitglieder der Typennummer haben: x und y, und ein Verfahren distance, die ein number andere Point Instanz und gibt empfängt.
Die Schnittstelle implementiert keine von denen.

Klassen sind die Implementierungen:

class PointImplementation implements Point { 
    public x: number; 
    public y: number; 

    constructor(x: number, y: number) { 
     this.x = x; 
     this.y = y; 
    } 

    public distance(other: Point): number { 
     return Math.sqrt(Math.pow(this.x - other.x, 2) + Math.pow(this.y - other.y, 2)); 
    } 
} 

(code in playground)

In Ihrem Beispiel Sie Ihre Person Klasse einmal als Klasse behandeln, wenn Sie es und einmal als Schnittstelle erweitern, wenn Sie es implementieren.
Ihr Code:

class Person { 
    name: string; 
    age: number; 
} 
class Child extends Person {} 

class Man implements Person {} 

Hat ein Übersetzungsfehler zu sagen:

Klasse falsch 'Man' implementiert Schnittstelle 'Person'.
Eigenschaft 'Name' fehlt im Typ 'Man'.

Und das ist, weil Schnittstellen Implementierung fehlt.
Also, wenn Sie implement eine Klasse dann nur ohne die Umsetzung seinen „Vertrag“ übernehmen, so dass Sie dies tun müssen, werden:

Unterm Strich ist

class NoErrorMan implements Person { 
    name: string; 
    age: number; 
} 

(code in playground), dass die meisten Fälle in Sie wollen extend eine andere Klasse und nicht implement es.

Answer 3

Große Antwort von @ nitzan-tomer! Hat mir sehr geholfen ... ich seine Demo ein wenig mit erweitertem:

Typ

IPoint interface; 
Point implements IPoint; 
Point3D extends Point; 

Und wie verhalten sie sich in Funktionen erwarten einen IPoint.

Also was ich bisher gelernt habe und als eine Daumenregel verwendet: Wenn Sie Klassen und Methoden verwenden, die generische Typen erwarten, verwenden Sie Schnittstellen als die erwarteten Typen. Und stellen Sie sicher, dass das übergeordnete Element oder die Basisklasse diese Schnittstelle verwendet. Auf diese Weise können Sie alle Unterklassen verwenden, soweit sie die Schnittstelle implementieren.

Hier die extended demo