typescript - Forskjellen mellom 'interface' og 'declare interface'

Hva er forskjellen (hvis noen) mellom:

declare interface SomeInterface {
    //members here
}

og :

interface SomeInterface {
    //members here
}

?

Svar #1

declare-nøkkelordet brukes vanligvis i typedefinisjoner for å beskrive eksisterende klasser eller variabler som er definert eksternt i JavaScript-kode.

Det er ingen forskjell mellom declare interface og interface fordi:

  • det finnes ingen kodegenerering for grensesnitt, og de eksisterer bare i Typescript-kode, så du kan ikke declare interface som er definert i JavaScript-kode;
  • interface i Typescript er av sin natur kun en deklarasjon, den har ingen metodekropper, egenskapsverdier osv., så både declare interface og interface er syntaktisk like.

Svar #2

Hva som også vil være nyttig å forstå for å kunne svare på spørsmålet er konseptet Interface Declaration Merging. I TS fungerer Interface Declaration Merging som følger:

Når vi erklærer et grensesnitt flere ganger (med eller uten declare-nøkkelordet), blir de slått sammen. Dette betyr at grensesnittet nå har egenskapene fra begge grensesnittene slått sammen. Dette forstås best gjennom et eksempel:

// Usually this interface would be defined in another file
// or package already
interface foo { num1: number }

// Because the interface foo is already defined TS will apply 
// interface declaration merging
declare interface foo{num2: number}
// Declare keyword makes it more explicit that is was defined
// somewhere else, it adds n


let fooObj: foo = { num1: 1 }
// Typescript will give the following error:
// Property 'num2' is missing in type '{ num1: number; }' 
// but required in type 'foo'.(2741)

// It requires the property num2 because after the interface merging 
// the interface contains both num1: number, and num2: number properties


// This interface declaration merging functionally similar to 
// the foo interface above, just without the declare keyword
interface bar{ string1: string }
interface bar{ string2: string }

let barObj: bar = { string1: 'hi', string2: 'hithere' }

bruk declare-nøkkelordet foran et grensesnitt

Merk at declare interface gjør det bare mer eksplisitt at grensesnittet ble definert et annet sted (annen fil, pakke, osv.) og ikke noe mer. Det vil si, det legger til ingen ekstra funksjonalitet i det hele tatt.

Merk også at grensesnitt bare finnes for å gi ekstra typeinformasjon til TS-kompilatoren og eksisterer ikke i den kompilerte JS-en. Koden ovenfor blir kompilert til følgende JS:

"use strict";
let fooObj = { num1: 1 };
let barObj = { string1: 'hi', string2: 'hithere' };

Relaterte artikler