Comprendre l’intérêt de créer et d’utiliser un namespace grâce au TypeScript

Pourquoi utiliser un namespace ?

Un namespace ou un espace de nom est simple d’utilisation et nous permet de nous y retrouver dans notre code. Nous avons grâce au namespace la possibilité de bien organiser notre code TypeScript et d’éviter les conflits.

Ces conflits peuvent intervenir lorsque plusieurs fonctions ou classes existent dans notre projet.

Créer un namespace sous TypeScript

Ci-dessous la création d’un namespace sous TypeScript.

namespace Henrique {
}

Dans ce namespace nous pouvons insérer des classes ou des fonctions qui devront être exportées grâce au mot clé "export". Pour simplifier les choses, nous allons juste créer une fonction qui permet d’afficher un message dans la console du navigateur.

namespace Henrique {
    export function afficherMessage(): void {
        console.log('Namespace: Henrique');
    }
}

Utilisation du namespace

Pour appeler la fonction présente dans le namespace il faut dans un premier temps indiquer dans quel namespace nous nous trouvons.

// Affiche le message 'Namespace: Henrique' dans la console
Henrique.afficherMessage();

Quel est l’intérêt du namespace ?

À ce stade nous pourrions avoir l’impression que cette fonctionnalité de TypeScript complique juste un peu les choses. Mais pour comprendre l’intérêt réel du namespace nous allons imaginer un autre exemple avec deux namespaces différents dans le projet. Ils possèderont chacun une fonction nommé de manière identique.

namespace Henrique {
    export function afficherMessage(): void {
        console.log('Namespace: Henrique');
    }
}

namespace Melanie {
    export function afficherMessage(): void {
        console.log('Namespace: Mélanie');
    }
}

Nous avons ici deux namespaces qui sont presque identiques, les seules différences résident dans le nom du namespace et le message de la console.

Par contre, le nom de la fonction est identique. Si j’avais intégré les deux fonctions identiques dans mon projet, il y aurait conflit. Mais grâce au namespace je peux les appeler sans problème et sans changer le nom des fonctions.

// Affiche le message 'Namespace: Henrique' dans la console
Henrique.afficherMessage();

// Affiche le message 'Namespace: Mélanie' dans la console
Melanie.afficherMessage();

Les namespaces seront très utiles lorsqu’un autre développeur partage une collection de fonctions que vous souhaitez utiliser. Dans certains cas, il serait peut-être plus judicieux d’utiliser des classes. La particularité des namespaces est qu’il est facile de créer un paquet de fonctions et de classes qui pourra être partagé.

Une autre manière de l’utiliser

Il est tout à fait possible d’utiliser d’une autre manière un espace de nom préalablement créer. Pour cela nous allons utiliser le mot clé "import".

// On importe le namespace Henrique dans la variable h
import h = Henrique;

// h contient toutes les fonctions et class du namespace Henrique
// h.afficherMessage() renvoie le même résultat que Henrique.afficherMessage()
h.afficherMessage()

Cette alternative pourra être utile si nous souhaitons travailler avec un alias plutôt que le nom du namespace.