Stay Tuned
Nos Services
Nos Guides
Interfaces
Une interface TypeScript permet de définir la signature (ou le contrat) d'une classe où même une fonction.
Les interfaces TypeScript ne sont utilisées que lors de la transpilation. Elle disparaissent totalement en runtime étant donné qu'elles ne contiennent pas de code.
Class interface
1
interface Serializable {
2
serialize(): string;
3
}
4
5
class Customer implements Serializable {
6
7
firstName: string;
8
9
serialize() {
10
return this.firstName;
11
}
12
13
}
14
15
class Cache {
16
17
setItem(key: string, value: Serializable) {
18
...
19
}
20
21
}
22
23
const cache = new Cache();
24
25
cache.setItem('current-user', new Customer());
Copied!
Les "styles guides" TypeScript et Angular découragent l'utilisation du préfixe
I pour les interfaces.Cela est principalement lié au deux raisons suivantes :
- Au fil des refactorings, les classes deviennent des interfaces avec plusieurs implémentations.
- Grâce à l'injection de dépendance, nous travaillerons la plupart du temps avec des interfaces. Le code perd alors en lisibilité si tous les types sont préfixés par des
I.
Function interface
Il est également possible de définir des interfaces pour les fonctions.
Très pratique dans un environnement asynchrone où il pleut de la "callback".
1
class Product {
2
name: string;
3
price: number;
4
}
5
6
interface ProductFilterCallback {
7
(product: Product): boolean
8
}
9
10
class ProductRepository {
11
12
getMatchingItemList(filter: ProductFilterCallback) {
13
...
14
}
15
16
}
17
18
const productRepository = new ProductRepository();
19
20
productRepository.getMatchingItemList(product => product.price < 100);
21
22
// error TS2345: Argument of type '(product: Product) => number' is not assignable to parameter of type 'ProductFilterCallback'.
23
// Type 'number' is not assignable to type 'boolean'.
24
productRepository.getMatchingItemList(product => product.price);
Copied!
Fini le reverse engineering ou ça :
1
doSomething(data => {
2
console.log(data); // 🤞
3
});
Copied!
Dernière mise à jour 3yr ago
Copier le lien