TypeScript:接口与类型


Answers:


572

根据TypeScript语言规范

与总是引入命名对象类型的接口声明不同,类型别名声明可以为任何类型的类型引入名称,包括基本类型,联合类型和交集类型。

该规范继续提到:

接口类型与对象类型文字的类型别名有很多相似之处,但是由于接口类型提供了更多的功能,因此它们通常比类型别名更可取。例如,接口类型

interface Point {
    x: number;
    y: number;
}

可以写为类型别名

type Point = {
    x: number;
    y: number;
};

但是,这样做意味着失去了以下功能:

  • 可以在extend或Implements子句中命名接口,但是自TS 2.7起,对象类型文字的类型别名不能再为true。
  • 接口可以具有多个合并的声明,但是对象类型文字的类型别名不能。

109
第二个区别是“多个合并的声明”是什么意思?
jrahhali

66
@jrahhali如果您两次定义接口,则打字稿会将它们合并为一个。
安德烈·费多罗夫

39
@jrahhali如果您两次定义类型,打字稿会给您带来错误
Andrey Fedorov

18
@jrahhaliinterface Point { x: number; } interface Point { y: number; }
Nahuel Greco

20
我相信第一点extends or implements已不再是事实。类型可以通过扩展和实现class。这里有一个例子typescriptlang.org/play/...
dark_ruby

770

2019更新


当前答案和官方文档已过时。对于TypeScript的新手来说,没有示例就不清楚使用的术语。以下是最新差异的列表。

1.对象/功能

两者均可用于描述对象的形状或功能签名。但是语法不同。

接口

interface Point {
  x: number;
  y: number;
}

interface SetPoint {
  (x: number, y: number): void;
}

输入别名

type Point = {
  x: number;
  y: number;
};

type SetPoint = (x: number, y: number) => void;

2.其他类型

与接口不同,类型别名也可以用于其他类型,例如基元,并集和元组。

// primitive
type Name = string;

// object
type PartialPointX = { x: number; };
type PartialPointY = { y: number; };

// union
type PartialPoint = PartialPointX | PartialPointY;

// tuple
type Data = [number, string];

3.延伸

两者都可以扩展,但是语法也有所不同。此外,请注意,接口和类型别名不是互斥的。接口可以扩展类型别名,反之亦然。

接口扩展接口

interface PartialPointX { x: number; }
interface Point extends PartialPointX { y: number; }

类型别名扩展了类型别名

type PartialPointX = { x: number; };
type Point = PartialPointX & { y: number; };

接口扩展类型别名

type PartialPointX = { x: number; };
interface Point extends PartialPointX { y: number; }

类型别名扩展接口

interface PartialPointX { x: number; }
type Point = PartialPointX & { y: number; };

4.工具

类可以以完全相同的方式实现接口或类型别名。但是请注意,类和接口被视为静态蓝图。因此,他们不能实现/扩展命名联合类型的类型别名。

interface Point {
  x: number;
  y: number;
}

class SomePoint implements Point {
  x = 1;
  y = 2;
}

type Point2 = {
  x: number;
  y: number;
};

class SomePoint2 implements Point2 {
  x = 1;
  y = 2;
}

type PartialPoint = { x: number; } | { y: number; };

// FIXME: can not implement a union type
class SomePartialPoint implements PartialPoint {
  x = 1;
  y = 2;
}

5.声明合并

与类型别名不同,接口可以定义多次,并且将被视为单个接口(所有声明的成员都将被合并)。

// 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 };

9
如果官方文档已过时,那么在哪里可以确认您提供的信息?
iX3

59
根据这篇文章,似乎唯一选择类型别名上的接口的原因是,如果您希望使用接口的声明合并(第5点)功能。除此之外,它们是等效的(我认为类型别名提供更简洁的语法)。
maxedison

17
我总是将接口用于对象类型字面量,否则使用类型会更有意义,而且我认为无论如何都不应使用声明合并,实际上我永远都不会期望接口会在项目的另一个文件中声明额外的属性,类型检查最初是为了使您的生活更轻松,而又不因这种类似于忍者的界面而变得更难:D
Ahmed Kamal

8
因此,从根本上说,这是我们真正感到满意的选择的“几乎是个人的”选择?除了一个原因,您可以只使用typeinterface?。我仍然对何时应该使用另一种感到困惑。
约瑟夫·布里格斯

7
有人可以为您为什么要合并界面提供一些动力吗?这似乎使我感到困惑。为什么要在不同的块中分布接口的定义?
Vanquish46

95

从TypeScript 3.2(2018年11月)开始,以下内容适用:

在此处输入图片说明


9
您能否提供有关如何生成所提供的表格/图像的更多信息?例如源代码或文档链接
iX3,19年

23
是的,我的意思是内容的来源,而不是内容的表达。
iX3

3
我不相信可以扩展类型或接口,而且我真的看不到为什么要这么做?
丹·金

7
避免发布文字图片,而应将实际文字直接添加到您的帖子中。文本图像不容易解析或搜索,并且视障用户无法访问。
安德鲁·马歇尔

2
该表没有任何来源来支持其内容,我不会依赖它。例如,您可以使用type具有一定限制的方式来定义递归类型(并且从TypeScript 3.7开始,这些限制也消失了)。接口可以扩展类型。类可以实现类型。此外,将数据显示为表格的屏幕快照会使视力障碍的人完全无法访问。
—MichałMiszczyszyn


5

类型示例:

//为对象创建树结构。由于缺少交集(&),因此无法对界面执行相同操作

type Tree<T> = T & { parent: Tree<T> };

//键入以限制变量只分配一些值。接口没有联合(|)

type Choise = "A" | "B" | "C";

//由于类型,您可以借助条件机制来声明NonNullable类型。

type NonNullable<T> = T extends null | undefined ? never : T;

接口示例:

//您可以将接口用于OOP并使用“实现”来定义对象/类框架

interface IUser {
    user: string;
    password: string;
    login: (user: string, password: string) => boolean;
}

class User implements IUser {
    user = "user1"
    password = "password1"

    login(user: string, password: string) {
        return (user == user && password == password)
    }
}

//您可以使用其他接口扩展接口

    interface IMyObject {
        label: string,
    }

    interface IMyObjectWithSize extends IMyObject{
        size?: number
    }


-2

该文件已经解释了

  • 一个区别是接口创建了一个新名称,该名称在任何地方都可以使用。类型别名不会创建新名称-例如,错误消息不会使用别名。在较旧的TypeScript版本中,不能从中扩展或实现类型别名(也不能扩展/实现其他类型)。从2.7版开始,可以通过创建新的交集类型来扩展类型别名
  • 另一方面,如果您不能使用接口表达某种形状,而需要使用并集或元组类型,则通常使用类型别名。

接口与类型别名

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.