Búsqueda de sitios web

javascript - En Typescript, ¿cuál es la diferencia entre type e interface?

¿Cuáles son las diferencias entre los siguientes?

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

Respuesta #1

Las interfaces pueden ser extendidas

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

y también aumentado (el llamado combinación de declaraciones)

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

Sin embargo, los alias de tipo pueden representar algunas cosas que las interfaces no pueden

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

Entonces, en general, si solo tienes un tipo de objeto simple, como se muestra en tu pregunta, una interfaz suele ser un mejor enfoque. Si te encuentras queriendo escribir algo que no puede ser escrito como una interfaz, o quieres simplemente darle un nombre diferente a algo, un alias de tipo es mejor.

Respuesta #2

Poniendo las cosas en perspectiva

let myAge = 25;
let totalStatesInMyCountry = 25

Mira, ambas variables son iguales, es decir, (myAge === totalStatesInMyCountry), pero su contexto es totalmente diferente.

Este es un caso similar para los types y interfaces de TypeScript. Busca Foo

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

Foo como un type y como un interface se ve igual, similar a (myAge === totalStatesInMyCountry), pero este es solo un caso especial. Su contexto es totalmente diferente.

¿Cuándo pensar en interface en lugar de types?

  1. Estás haciendo cumplir que esta clase debe tener estos métodos. Estás pensando en interfaces, no en tipos.

  2. Quieres crear múltiples implementaciones del mismo contrato. Por ejemplo, para el contrato toHumanReadableNumber(number) se necesitan diferentes implementaciones: 100000 -> 100,000, 100000 -> 100K y 100000 -> 100 Mil. Supongamos que estás resolviendo este problema creando diferentes clases para cada requerimiento. Estás pensando en clases e interfaces y no en clases y tipos.

  3. Las interfaces están ahí para hacer que el sistema esté desacoplado, como al implementar los principios SOLID.

  4. Las interfaces son un sustituto de la herencia múltiple. Una clase solo puede heredar de una clase, pero puede tener múltiples interfaces.

  5. Para una class Point{ x:number,y:number, distanceFromCenter():number}, en el contexto de interfaces, solo distanceFromCenter():number importa.

----------x----------

Respuesta antigua (antes del 31 de diciembre de 2022)

Las diferencias entre estos dos ya están en este hilo.

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

Aquí type Foo y interface Foo se ven casi iguales, por lo que es confuso.

interface es un contrato que las siguientes propiedades (aquí foo:string) deben estar en un objeto. interface no es class. Se utiliza cuando el lenguaje no soporta herencia múltiple. Así que interface puede ser una estructura común entre diferentes clases.

class Bar implements Foo {
    foo: string;
}

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

Pero type y interface se utilizan en contextos muy diferentes.

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

Aquí type de foo es Foo y today es Date. Es como una declaración de variable que contiene la información del typeof de otra variable. type es como un superconjunto de interfaces, clases, firmas de funciones, otros tipos o incluso valores (como type mood='Good' | 'Bad'). Al final, type describe la estructura posible o el valor de una variable.

Artículos relacionados