В Typescript, в чем разница между типом и интерфейсом?

114

В чем разница между следующими?

type Foo = { 
    foo: string 
};
interface Foo {
   foo: string;
}
Martiansnoop
источник
3
тип не может быть расширен как расширение интерфейса. типы - это просто псевдонимы для типа.
PSL
4
Руководство доступно здесь: basarat.gitbooks.io/typescript/content/docs/types/…
basarat
2
Я в основном использую тип для внешних данных, например из файла JSON, или если вы пишете только функции без использования классов ООП.
Кокодоко
1
Я нашел эту статью полезной, которая объясняет различия - medium.com/@martin_hotell/…
Sandeep GB
1
Принятый ответ устарел. Обновленное объяснение, опубликованное здесь (поскольку эта ветка, похоже, пользуется поддержкой Google): stackoverflow.com/questions/37233735/…
jabacchetta

Ответы:

125

Возможности расширения интерфейсов

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

а также дополнен

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

Псевдонимы типов, однако, могут представлять то, что интерфейсы не могут

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

В общем, если у вас есть простой тип объекта, как показано в вашем вопросе, интерфейс обычно является лучшим подходом. Если вы обнаружите, что хотите написать что-то, что не может быть написано как интерфейс, или хотите просто дать чему-то другое имя, лучше использовать псевдоним типа.

Райан Кавано
источник
3
Type aliases, however, can represent some things interfaces can'tКак мне кажется, ваши примеры NeatAndCoolи JustSomeOtherNameмогут быть созданы как интерфейс, расширяющий существующие Neat, Coolили SomeTypeтипы.
Rudey
Действительно, второй и третий примеры могут быть созданы с помощью интерфейса:interface NeatAndCool extends Neat, Cool {} interface JustSomeOtherName extends SomeType {}
peterjwest
3
Расширение двух интерфейсов не всегда дает тот же результат, что и тип пересечения, и не все типы могут быть расширены (в то время как все типы могут иметь псевдонимы или объединяться в объединения / пересечения)
Райан Кавано
1
Так в чем же преимущество шрифта? Можно ли сказать, что когда у нас есть интерфейс, тип бесполезен?
Мостафа Саадатния
4

Также может быть реализован интерфейс .

Дэйв Форд
источник
1
И объект может реализовывать несколько интерфейсовclass Thing implements Neat, Cool
Кокодоко
1
Что ты имеешь в виду ? также Type can b реализован
nadav 07
3
Это должен быть комментарий, а не ответ имо.
Майкл Кунст
Уважаемый Дэйв, вы должны оставлять комментарий, а не ответ. Также на основе этого ответа ваш ответ не совсем правильный.
Mehrdad88sh
4

Типы похожи на интерфейсы и наоборот: оба могут быть реализованы классом. но есть некоторые важные отличия: 1. Когда Тип реализуется классом, свойства, принадлежащие Типу, должны быть инициализированы внутри класса, тогда как с Интерфейсом они должны быть объявлены. 2. как упомянул @ryan: интерфейс может расширять другой интерфейс. Типы не могут.

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'
}
Надав
источник
4

Различия между ними тоже уже в этой теме.

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

Здесь type Fooи interface Fooвыглядит почти одинаково, так что это сбивает с толку.

interfaceэто договор, что следующие свойства (здесь foo:string) должны быть в объекте. interfaceнет class. Он используется, когда язык не поддерживает множественное наследование. Так interfaceможет быть общая структура между разными классами.

class Bar implements Foo {
    foo: string;
}

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

Но typeи interfaceиспользуются в совсем другом контексте.

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

Вот typeиз fooэто Fooи todayесть Date. Это похоже на удаление переменной, которое содержит информацию о типе другой переменной. typeпохож на надмножество интерфейсов, классов, сигнатуры функции, других типов или даже значений (например type mood = 'Good' | 'Bad'). В конце typeописывается возможная структура или значение переменной.

amit77309
источник
4

Неправильно говорить «Интерфейсы могут быть реализованы», поскольку типы также могут быть реализованы

type A = { a: string };


class Test implements A {

    a: string;
}

Хотя вы можете это сделать, вы не можете реализовать тип, который является объединением типов, что, честно говоря, имеет смысл :)

Дэн
источник
4

Тип в машинописном тексте используется для ссылки на уже существующие типы . Не может быть продлен вроде interface. Примеры type:

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

вы можете использовать Rest и Spread в типах:

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

Интерфейс, с другой стороны, позволяет вам создать НОВЫЙ ТИП.

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
}
Удип Шрестха
источник