interface vs type
interface décrit la forme d’un objet et fusionne avec une déclaration du même nom, tandis que type est un alias pour tout type, y compris les unions et les tuples.
Comparaison point par point
#Ce qu’elle décrit
Extension
Deux déclarations du même nom
Unions et tuples
Implémentation par une classe (`implements`)
Usage typique
Exemple
#interface CourseInterface {
title: string
modules: number
}
type CourseType = {
title: string
modules: number
}
type Difficulty = 'easy' | 'medium' | 'hard'
const html: CourseInterface = { title: 'HTML et CSS', modules: 11 }
const python: CourseType = { title: 'Python', modules: 12 }
const level: Difficulty = 'medium'
console.log(html.title, python.modules, level)HTML et CSS 12 medium
Définition et utilisation
#Les deux constructions donnent un nom à la forme d’un objet, et dans la plupart des cas vous pouvez utiliser l’une ou l’autre. Le compilateur les vérifie de la même façon : un objet correspond au type s’il a les champs requis avec les bons types, peu importe que la forme ait été décrite par interface ou par type.
Les différences apparaissent à l’extension et avec les types qui ne sont pas des objets. Une interface s’étend avec le mot extends, et vous pouvez lui ajouter des champs avec une seconde déclaration du même nom, car les déclarations fusionnent. Un alias type s’étend avec l’intersection &, et deux déclarations du même nom sont une erreur de compilation. Seul type peut décrire une union, un tuple ou un type de fonction, car interface n’exprime que la forme d’un objet.
Pour les objets et les contrats de classes, interface est le choix naturel, surtout dans les bibliothèques, où la fusion de déclarations est utile. Pour les unions, les tuples, les types de fonctions et les résultats de types utilitaires, type est nécessaire. Beaucoup d’équipes adoptent une règle simple : les objets avec interface, tout le reste avec type.
Syntaxe
#interface Name {
field: type
}
type Name = typePlus d’exemples
#interface Config {
darkMode: boolean
}
interface Config {
fontSize: number
}
const config: Config = { darkMode: true, fontSize: 16 }
console.log(Object.keys(config))['darkMode', 'fontSize']
type Profile = { name: string }
type Profile = { age: number }
// Erreur : Duplicate identifier 'Profile'.type Pair = [string, number]
type Status = 'draft' | 'published'
const [title, exp]: Pair = ['Flexbox', 20]
const status: Status = 'draft'
console.log(title, exp, status)Flexbox 20 draft
Bonnes pratiques
#- Si vous avez seulement besoin d’un contrat sans implémentation, rappelez-vous qu’une classe abstraite est un autre outil : une interface ne contient pas de code, une classe abstraite le peut.
- Nommez les interfaces d’après ce que l’objet est (
User,Course), sans le préfixeI. - Fixez dans le projet une seule convention pour les objets ordinaires, pour ne pas hésiter à chaque déclaration.
Entrées associées
#- interfaceUne description nommée de la forme d’un objet, que vous pouvez étendre et fusionner.
- typeUn alias de type : un nom pour n’importe quel type, y compris les unions, les tuples et les types complexes.
- extends (interfaces)Étendre une interface avec de nouveaux champs, à partir d’une interface existante.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.