简体   繁体   中英

In Typescript, what is the difference between type and interface?

What are the differences between the following?

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

Interfaces can be extended

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

and also augmented

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

Type aliases, however, can represent some things interfaces can't

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

So in general if you just have a plain object type, as shown in your question, an interface is usually a better approach. If you find yourself wanting to write something that can't be written as an interface, or want to just give something a different name, a type alias is better.

Differences between these too are already in this thread.

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

Here type Foo and interface Foo looks almost similar so its confusing.

interface is contract that the following properties (here foo:string ) should be there in a object. interface is not class . It is used when language does not support Multiple Inheritance. So interface can be a common structure between different classes.

class Bar implements Foo {
    foo: string;
}

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

But type and interface are used in very different context.

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

Here type of foo is Foo and today is Date . Its like a variable decleration which holds the information of typeof other variable. type is like a superset of interfaces, classes, function signature, other types or even values (like type mood = 'Good' | 'Bad' ). At the end type describes the possible structure or value of a variable.

It is wrong to say "Interfaces can be implemented" since types can also be implemented

type A = { a: string };


class Test implements A {

    a: string;
}

Although you can do this, you can't implement a type that is a Union of types, which makes totally sense honestly :)

Types is kinda like Interfaces and vice versa: both can implemented by a class. but there are some important differences: 1. when Type is implemented by a class, the properties which belong to the Type must be initialized inside the class, whereas with Interface they must be declared. 2. as @ryan mentioned : Interface can extend another Interface. Types cannot.

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'
}

type in the typescript is used to reference already existing types . It can not be extended like interface . Examples of type are:

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

you can use Rest and Spread in types:

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

Interface, on the other hand, allows you to create a NEW TYPE.

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
}

此外,还可以实现接口。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM