Typ ✔ vs. Schnittstelle ❌: Warum Sie in Typoskript den Typ gegenüber der Schnittstelle wählen sollten.

Ich bin zu der Lösung gekommen, dass man immer Typen statt Schnittstellen verwenden sollte. Lassen Sie uns zusammenfassen, warum!!

• Schnittstellen können nur Objekte angeben, Typaliase können jedoch Objekte und alles andere angeben. Nehmen wir an, wir haben ein einzelnes Adressfeld und mit „Typ“ definieren Sie seinen Typ wie folgt:

type Address = string;
const address: Address = '123 Hallway'

Aber mit einer Schnittstelle wie:
kann man solche Dinge nicht machen

interface Address = string; //error
const address: Address = '123 Hallway'

Weil Schnittstellenaliase nur Objekte definieren können. Wir müssen die Struktur komplett ändern, wenn wir eine Schnittstelle wie diese verwenden möchten:

interface Address {
    address: string;
}
const address: Address = {
    address: '12 3 Hallway'
}

Das ist das erste Problem mit Schnittstellen.

• Typ-Alias ​​kann Union-Typen definieren und Schnittstellen-Alias ​​kann nicht: Der Benutzer kann mehrere oder eine einzelne Adresse haben:

type Address = string | string[] ;
const address: Address = '123 Hallway'
const newAddress: Address= ['123 Hallway', 'Flag Plaza']

Zeichenfolge | string[] wird als Union-Typ bezeichnet, die Adresse kann ein String oder ein String-Array sein.

Sie können solche Dinge mit einem Schnittstellenalias tun.

• types-Alias ​​kann problemlos Dienstprogrammtypen verwenden. Eine Schnittstelle kann zwar funktionieren, sieht aber hässlich aus. Betrachten Sie beispielsweise ein Benutzerobjekt:

type User = {
    name: string;
    age: number;
    created_at: Date;
}

Nehmen wir an, wir haben ein Gastobjekt, das nicht angemeldet ist, aber wir können überprüfen, wann es erstellt wurde (das erste Mal auf der Seite gelandet ist). In diesem Szenario ist der Gast wie ein Benutzer, aber kein tatsächlicher Benutzer. Wir möchten die Eigenschaft „created_at“ in „Guest“ vom Benutzertyp „Alias“ haben. Wir machen es wie folgt:

     type Guest = Omit<User, 'name' | 'age'>

Technisch ist es mit der Schnittstelle möglich, aber sehen Sie, wie es funktioniert:

type Guest extends Omit<User, 'name' | 'age'> {}

Es funktioniert, aber es ist eine hässliche Syntax, nicht wahr?

• Manchmal müssen Sie Tupel beschreiben. So beschreiben wir es mit dem Typalias

type Address = [string, number, string] ;
const address: Address = ['Hallway', 2, 'Abdul Plaza']

Aber mit der Schnittstelle sehen Sie, wie wir es machen:

type Address extends Array<number | string> {
    0: string
    1: number;
    2: string;
}

const address: Address = ['Hallway', 2, 'Abdul Plaza']

Schon wieder eine hässliche Syntax.

• Mit Typen-Alias ​​können wir Typen sehr einfach extrahieren.

const love_bonito ={
    level: 1,
    store_id: 'scad_12hdedhefgfeaa',
    country: ['US','PK','IND'],
    user: {
        user_id: "blah',
        username: 'nishat',
        likes: 421,
    },
};

// let's extract type for love_bonito
type LoveBonito = typeOf love_bonito;

// or even something inside love_bonito
type User = typeOf love_bonito.user;  

Der Bonus hierfür ist, dass wir das auch tun können, wenn wir bereits jetzt Level immer eins und nichts anderes haben:

const love_bonito ={
    level: 1,
    store_id: 'scad_12hdedhefgfeaa',
    country: ['US','PK','IND'],
    user: {
        user_id: "blah';
        username: 'nishat';
        likes: 421;
    },
} as const

// let's extract type for love_bonito
type LoveBonito = typeOf love_bonito

// or even something inside love_bonito
type User = typeOf love_bonito.user

Jetzt wird die Stufe als 1 und nicht als irgendeine Zahl abgeleitet.

• Mit dem Schnittstellenalias können Sie eine Schnittstelle neu deklarieren,

interface Home {
    rooms: number;
    light_bulbs: 12;
    rented_to: "Abu Turab";
}

interface Home {
   fans: 16;
}

// final type 

interface Home {
    rooms: 3;
    light_bulbs: 12;
    rented_to: "Abu Turab";
    fans: 16;
}

Wir können den Typalias nicht neu deklarieren. Sie denken vielleicht: „Oh! Sheraz, das ist ein Pluspunkt der Schnittstelle“, aber das ist eigentlich nicht der Fall!!!

Es klingt verwirrend, wenn in Ihrer gesamten Codebasis mehrere Deklarationen mit demselben Bezeichner vorhanden sind. Es kommt mir wirklich verwirrend vor.

Angenommen, Sie arbeiten mit einem Team und kennen den Typ eines Objekts (mit der Schnittstelle deklarierte Typen), aber jemand in Ihrem Team deklariert es neu und ändert es. Was würden Sie tun?

Aber mit dem Typalias wird dieses Problem auch gelöst. Wenn Sie einen Typ erneut deklarieren, wird ein Fehler ausgegeben

doppelte Kennung

• Der Name der Bibliothek ist TYPESCRIPT, nicht INTERFACESCRIPT. Das mag komisch sein, aber warum sollte ein Unternehmen seine Bibliothek TYPESCRIPT und nicht IBTERFACESCRIPT nennen? Wenn ein Unternehmen Typ gegenüber Schnittstelle bevorzugt, warum tun Sie es dann nicht? ?

Abschluss

Bevorzugen Sie immer Typen gegenüber Schnittstellen. Einige Entwickler sagen, dass Schnittstellen schneller geladen werden als Typen ... Aber das ist in der Vergangenheit passiert. Heutzutage gibt es keinen Unterschied hinsichtlich der Leistung. Es gibt einige Anwendungsfälle, in denen Sie möglicherweise Schnittstellen benötigen, aber das bedeutet nicht, dass Sie ständig Schnittstellen benötigen.

Das obige ist der detaillierte Inhalt vonTyp ✔ vs. Schnittstelle ❌: Warum Sie in Typoskript den Typ gegenüber der Schnittstelle wählen sollten.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!