Was ist in Typescript der Unterschied zwischen Typ und Schnittstelle?

Was sind die Unterschiede zwischen den folgenden?

type Foo = { 
    foo: string 
};
interface Foo {
   foo: string;
}

Schnittstellen können erweitert werden

interface A {
  x: number;
}
interface B extends A {
  y: string;
}

und auch erweitert

interface C {
  m: boolean;
}
// ... later ...
interface C {
  n: number;
}

Typ-Aliase können jedoch einige Dinge darstellen, die Schnittstellen nicht können

type NumOrStr = number | string;
type NeatAndCool = Neat & Cool;
type JustSomeOtherName = SomeType;

Wenn Sie also nur einen einfachen Objekttyp haben, wie in Ihrer Frage gezeigt, ist eine Schnittstelle im Allgemeinen ein besserer Ansatz. Wenn Sie etwas schreiben möchten, das nicht als Schnittstelle geschrieben werden kann, oder einfach etwas anders benennen möchten, ist ein Typalias besser.

Es kann auch eine Schnittstelle implementiert werden .

Types ähnelt Interfaces und umgekehrt: Beide können von einer Klasse implementiert werden. Es gibt jedoch einige wichtige Unterschiede: 1. Wenn Type von einer Klasse implementiert wird, müssen die Eigenschaften, die zum Type gehören, innerhalb der Klasse initialisiert werden, während sie bei Interface deklariert werden müssen. 2. wie @ryan erwähnt: Schnittstelle kann eine andere Schnittstelle erweitern. Typen können nicht.

type Person = {
    name:string;
    age:number;
}

// must initialize all props - unlike interface
class Manager implements Person {
    name: string = 'John';
    age: number = 55;

    // can add props and methods
    size:string = 'm';
}

const jane : Person = {
    name :'Jane',
    age:46,

    // cannot add more proprs or methods
    //size:'s'
}

Auch Unterschiede zwischen diesen gibt es bereits in diesem Thread.

type Foo = {
    foo: string
};
interface Foo {
    foo: string;
}

Hier type Foound interface Foosieht fast ähnlich aus, so ist es verwirrend.

interfaceist Vertrag, dass die folgenden Eigenschaften (hier foo:string) in einem Objekt vorhanden sein sollten. interfaceist nicht class. Es wird verwendet, wenn die Sprache die Mehrfachvererbung nicht unterstützt. So interfacekann eine gemeinsame Struktur zwischen verschiedenen Klassen sein.

class Bar implements Foo {
    foo: string;
}

let p: Foo = { foo: 'a string' };

Aber typeund interfacewerden in sehr unterschiedlichen Zusammenhängen eingesetzt.

let foo: Foo;
let today: Date = new Date();

Hier typeder fooist Foound todayist Date. Es ist wie eine Variablendekleration, die die Informationen des Typs einer anderen Variablen enthält. typeist wie eine Obermenge von Schnittstellen, Klassen, Funktionssignaturen, anderen Typen oder sogar Werten (wie type mood = 'Good' | 'Bad'). Am Ende typebeschreibt die mögliche Struktur oder den Wert einer Variablen.

Es ist falsch zu sagen, dass "Schnittstellen implementiert werden können", da auch Typen implementiert werden können

type A = { a: string };


class Test implements A {

    a: string;
}

Obwohl Sie dies tun können, können Sie keinen Typ implementieren, der eine Union von Typen ist, was ehrlich gesagt absolut sinnvoll ist :)

Der Typ im Typenskript wird verwendet, um auf bereits vorhandene Typen zu verweisen . Es kann nicht wie erweitert werden interface. Beispiele typesind:

type Money = number;
type FormElem = React.FormEvent<HTMLFormElement>;
type Person = [string, number, number];

Sie können Rest and Spread in folgenden Typen verwenden:

type Scores = [string, ...number[]];
let ganeshScore = ["Ganesh", 10, 20, 30]
let binodScore = ["Binod", 10, 20, 30, 40]

Mit der Schnittstelle können Sie dagegen einen NEUEN TYP erstellen.

interface Person{
  name: string,
  age: number, 
}

Interface can be extended with extends keyword.
interface Todo{
  text: string;
  complete: boolean;
}

type Tags = [string, string, string]

interface TaggedTodo extends Todo{
 tags: Tags
}