Was ist der Unterschied zwischen Schnittstelle und Typ? In diesem Artikel werden Schnittstelle und Typ in TypeScript verglichen, Sie werden über den Unterschied zwischen Schnittstelle und Typ informiert und es wird vorgestellt, welche Schnittstelle Sie bei der tatsächlichen Verwendung auswählen sollten!
Wenn wir TypeScript verwenden, verwenden wir interface
und type
. Normalerweise scheint es, dass ihre Verwendung gleich ist und beide sehr unterschiedlich sind gut, daher ist es selten, den Unterschied zwischen ihnen wirklich zu verstehen. Wir haben Typen entwickelt, die oft so definiert sind: interface
和 type
,平时感觉他们用法好像是一样的,没啥区别,都能很好的使用,所以也很少去真正的理解它们之间到底有啥区别。我们开发过经常或这么来定义类型:
interface Point { x: number; y: number; }
或者这样定义:
type Point = { x: number; y: number; };
interface
和 type
之间的差异不仅仅是次要语法声明。那么,今天我们就来看看这两家伙之间存在啥不可告人的秘密。
TypeScript 有 boolean
、number
、string
等基本类型。如果我们想声明高级类型,我们就需要使用类型别名。
类型别名指的是为类型创建新名称。需要注意的是,我们并没有定义一个新类型。使用type
关键字可能会让我们觉得是创建一个新类型,但我们只是给一个类型一个新名称。
所以我们所以 type 时,不是在创建新的类别,而是定义类型的一个别名而已。
与 type
相反,接口仅限于对象类型。它们是描述对象及其属性的一种方式。类型别名声明可用于任何基元类型、联合或交集。在这方面,接口被限制为对象类型。
在讨论它们的区别之前,我们先来看看它们的相似之处。
interface 和 type 都可以继承。另一个值得注意的是,接口和类型别名并不互斥。类型别名可以继承接口,反之亦然。
对于一个接口,继承另一个接口
interface PartialPointX { x: number; } interface Point extends PartialPointX { y: number; }
或者,继承一个类型
type PartialPointX = { x: number; }; interface Point extends PartialPointX { y: number; }
类型继承另一个类型:
type PartialPointX = { x: number; }; type Point = PartialPointX & { y: number; };
或者,继承一个接口:
interface PartialPointX { x: number; } type Point = PartialPointX & { y: number; };
类可以实现接口以及类型(TS 2.7+)。但是,类不能实现联合类型。
interface Point { x: number; y: number; } class SomePoint implements Point { x = 1; y = 2; } type AnotherPoint = { x: number; y: number; }; class SomePoint2 implements AnotherPoint { x = 1; y = 2; } type PartialPoint = { x: number; } | { y: number; }; // Following will throw an error class SomePartialPoint implements PartialPoint { x = 1; y = 2; }
虽然接口可以被扩展和合并,但它们不能以联合和交集的形式组合在一起。类型可以使用联合和交集操作符来形成新的类型。
// object type PartialPointX = { x: number; }; type PartialPointY = { y: number; }; // 并集 type PartialPoint = PartialPointX | PartialPointY; // 交集 type PartialPoint = PartialPointX & PartialPointY;
TypeScript编译器合并两个或多个具有相同名称的接口。 这不适用于类型。 如果我们尝试创建具有相同名称但不同的属性的两种类型,则TypeScript编译器将抛出错误。
// These two declarations become: // interface Point { x: number; y: number; } interface Point { x: number; } interface Point { y: number; } const point: Point = { x: 1, y: 2 };
元组(键值对)只能通过type
type Point = [x: number, y: number];
interface Point { coordinates: [number, number] }
interface
und type
ist mehr als nur eine geringfügige Syntaxdeklaration . Heute werfen wir einen Blick auf die verborgenen Geheimnisse dieser beiden Typen. boolean
, number
und string
. Wenn wir Typen höherer Ebene deklarieren möchten, müssen wir Typaliase
verwenden.Wenn wir also Typ verwenden, erstellen wir keine neue Kategorie, sondern definieren lediglich einen Alias des Typs. 🎜🎜Im Gegensatz zuTyp-Aliasing bezieht sich auf die Erstellung eines neuen Namens für einen Typ.
Es ist zu beachten, dasswir keinen neuen Typ definieren. Die Verwendung des Schlüsselworts
type
mag so aussehen, als würden wir einen neuen Typ erstellen, aber wir geben einem Typ lediglich einen neuen Namen.
type
ist die Schnittstelle auf Objekttypen beschränkt. Sie sind eine Möglichkeit, Objekte und ihre Eigenschaften zu beschreiben. Typaliasdeklarationen können für jeden primitiven Typ, jede Union oder jeden Schnittpunkt verwendet werden. 🎜In dieser Hinsicht sind Schnittstellen auf Objekttypen beschränkt🎜. 🎜🎜🎜Ähnlichkeiten zwischen Schnittstelle und Typ🎜🎜🎜Bevor wir ihre Unterschiede diskutieren, werfen wir einen Blick auf ihre Ähnlichkeiten. 🎜type
definiert werden. 🎜rrreee🎜 Es gibt keine Möglichkeit, ein Tupel über eine Schnittstelle zu deklarieren. Allerdings können wir Tupel innerhalb von Schnittstellen verwenden🎜rrreee🎜🎜Welches sollten wir verwenden? 🎜🎜🎜Generell sind Schnittstellen und Typen sehr ähnlich. 🎜🎜Für öffentliche API-Definitionen in Bibliotheken oder Typdefinitionen von Drittanbietern sollten Schnittstellen verwendet werden, um Funktionen zum Zusammenführen von Deklarationen bereitzustellen. Ansonsten können wir verwenden, was wir wollen, aber es sollte in der gesamten Codebasis konsistent sein. 🎜🎜🎜Englische Originaladresse: https://www.wisdomgeek.com/development/web-development/typescript/typescript-the-difference-between-interface-and-type/🎜🎜Autor: SARANSH KATARIA🎜🎜🎜Mehr für Programmierkenntnisse finden Sie unter: 🎜Einführung in die Programmierung🎜! ! 🎜Das obige ist der detaillierte Inhalt vonEin einfacher Vergleich, um den Unterschied zwischen Schnittstelle und Typ in TypeScript zu erkennen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!