Typescript'te tip ve arayüz arasındaki fark nedir?

Aşağıdakiler arasındaki farklar nelerdir?

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

Arayüzler genişletilebilir

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

ve ayrıca artırılmış

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

Ancak tür takma adları, arabirimlerin yapamayacağı bazı şeyleri temsil edebilir.

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

Dolayısıyla, genel olarak, sorunuzda gösterildiği gibi, yalnızca bir düz nesne türünüz varsa, bir arayüz genellikle daha iyi bir yaklaşımdır. Kendinizi arayüz olarak yazılamayan bir şey yazmak isterken veya bir şeye sadece farklı bir ad vermek istiyorsanız, bir tür takma adı daha iyidir.

Ayrıca bir arayüz de uygulanabilir .

Türler, Arabirimler gibidir ve bunun tersi de geçerlidir: her ikisi de bir sınıf tarafından uygulanabilir. ancak bazı önemli farklılıklar vardır: 1. Type bir sınıf tarafından uygulandığında, Type'a ait özellikler sınıf içinde başlatılmalı, oysa Interface ile bildirilmeli. 2. @ryan'ın da bahsettiği gibi: Arayüz başka bir Arayüzü genişletebilir. Türler olamaz.

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

Bunların arasındaki farklar da zaten bu başlıkta.

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

Burada type Foove interface Fooneredeyse benzer görünüyor, bu yüzden kafa karıştırıcı.

interfaceaşağıdaki özelliklerin (burada foo:string) bir nesnede olması gerektiği sözleşmesidir . interfacedeğil class. Dil Çoklu Devralmayı desteklemediğinde kullanılır. Yani interfacefarklı sınıflar arasında ortak bir yapı olabilir.

class Bar implements Foo {
    foo: string;
}

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

Ancak typeve interfaceçok farklı bağlamlarda kullanılmaktadır.

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

İşte typeait fooolduğunu Foove todaybir Date. Diğer değişkenin türünün bilgisini tutan değişken bir açıklama gibidir. typearayüzlerin, sınıfların, işlev imzasının, diğer türlerin ve hatta değerlerin (benzeri type mood = 'Good' | 'Bad') bir üst kümesi gibidir . Sonunda typebir değişkenin olası yapısını veya değerini açıklar.

Türler de uygulanabildiği için "Arayüzler uygulanabilir" demek yanlıştır.

type A = { a: string };


class Test implements A {

    a: string;
}

Bunu yapabilmenize rağmen, tamamen mantıklı olan bir türler Birliği olan bir tür uygulayamazsınız :)

typScript, zaten mevcut olan türlere başvurmak için kullanılır . Gibi uzatılamaz interface. Örnekler typeşunlardır:

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

Rest ve Spread'i şu türlerde kullanabilirsiniz:

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

Arayüz ise YENİ TİP oluşturmanıza izin verir.

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
}