TypeScript en 2 minutes : Guide Express du Typage Intelligent

Tu es développeur JavaScript et tu cherches à sécuriser ton code ? Bienvenue dans ce guide express de TypeScript, le superset de JavaScript qui va révolutionner ta façon de coder !

🎯 Pourquoi TypeScript ?

TypeScript n'est pas qu'un simple outil de typage - c'est ton meilleur allié pour :

• Détecter les erreurs avant l'exécution
• Améliorer la maintenance du code
• Bénéficier d'un excellent autocomplétion
• Faciliter le travail en équipe

🔑 Les Types Fondamentaux

Voici les types que tu utiliseras quotidiennement :

typescript
1// Types primitifs
2const nom: string = 'Alice';
3const age: number = 25;
4const estDeveloppeur: boolean = true;
5
6// Tableaux
7const competences: string[] = ['TypeScript', 'React', 'Node.js'];
8
9// Objets typés
10interface Developpeur {
11  nom: string;
12  age: number;
13  competences: string[];
14}
15
16const dev: Developpeur = {
17  nom: 'Alice',
18  age: 25,
19  competences: ['TypeScript', 'React', 'Node.js'],
20};

🛡️ TypeScript en Action

1. Functions avec Types

typescript
1// Fonction typée avec paramètres et retour
2function calculerSalaire(tauxHoraire: number, heures: number = 35): number {
3  return tauxHoraire * heures;
4}
5
6// Fonction fléchée avec type
7const direBonjour = (nom: string): string => `Bonjour ${nom} !`;

2. Types Avancés

typescript
1// Union Types
2type StatutProjet = 'EN_COURS' | 'TERMINE' | 'EN_PAUSE';
3let statut: StatutProjet = 'EN_COURS';
4
5// Types Génériques
6interface Reponse<T> {
7  data: T;
8  status: number;
9}
10
11const reponseAPI: Reponse<Developpeur> = {
12  data: dev,
13  status: 200,
14};

3. Null Safety avec Optional Chaining

typescript
1interface Projet {
2  client?: {
3    nom?: string;
4  };
5}
6
7const projet: Projet = {};
8const nomClient = projet.client?.nom ?? 'Client Anonyme';

🚀 Astuces Pro

Type Guards pour une Meilleure Sécurité

typescript
1interface Admin {
2  role: 'admin';
3  droits: string[];
4}
5
6interface User {
7  role: 'user';
8  niveau: number;
9}
10
11function gererUtilisateur(personne: Admin | User) {
12  if (personne.role === 'admin') {
13    console.log(personne.droits); // TypeScript sait que c'est un Admin
14  } else {
15    console.log(personne.niveau); // TypeScript sait que c'est un User
16  }
17}

Utility Types Essentiels

typescript
1// Partial - Rend toutes les propriétés optionnelles
2type DevPartiel = Partial<Developpeur>;
3
4// Pick - Sélectionne certaines propriétés
5type DevBasic = Pick<Developpeur, 'nom' | 'age'>;
6
7// Omit - Exclut certaines propriétés
8type DevSansCompetences = Omit<Developpeur, 'competences'>;

🎓 Pour Aller Plus Loin

• Utilise strict: true dans ton tsconfig.json
• Installe des extensions VS Code pour TypeScript
• Pratique avec des projets réels
• Explore les types génériques avancés

🏁 Conclusion

TypeScript n'est pas juste un outil de plus - c'est un investissement dans la qualité de ton code. En quelques minutes, tu as découvert les bases qui te permettront de coder plus sereinement. Prêt à transformer ton JavaScript en TypeScript ? C'est parti ! 🚀

N'hésite pas à partager cet article si tu l'as trouvé utile ! À bientôt pour plus d'astuces de développement ! 👋