TypeScript
5 - Les types primitifs

Les Types primitifs

Renommez le fichier script.ts par 1-types-primitives.ts.

Les types primitifs

La liste des types primitifs en TypeScript est la même qu'en JavaScript :

  • string
  • number
  • boolean
  • null
  • undefined
  • symbol
  • bigint

Comme nous l'avons vu, pour déclarer un type il faut ajouter :type après le nom de la variable.

const city: string = "Paris";
const department: number = 75;
const isCapital: boolean = true;
 
console.log(`Hello ${city}, department: ${department}`, isCapital ? "✨" : "");
export {}

Erreurs TS

L'avantage d'utiliser TypeScript est d'utiliser les bons paramètres et méthodes.

const city = "Paris";
const department = 75;
const isCapital = true;
 
console.log(department.length) // Error: Property 'length' does not exist on type 'number'.
console.log(city.length) // fonctionne
 
console.log(`Hello ${city}, department: ${department}`, isCapital ? "✨" : "");
export {}
  • department.length ❌ TypeScript va me dire que la propriété length n'existe pas sur le type number.
  • city.length ✅ ça fonctionne.

Autocompletion IDE

Un autre avantage c'est l'autocompletion de l'IDE

Autocompletion

Compilation JS

En revanche TS compile en JS et le JS onctionne bien.

Nous allons ajouter une option pour que TypeScript ne compile pas le code si une erreur est détectée.

// tsconfig.json
{
  "compilerOptions": {
    "noEmitOnError": true
  }
}

Testons avec une erreur. Désormais, le fichier JS ne sera pas généré / mis à jour.

Inférence de type

Il n'est pas obligatoire de déclarer le type, TypeScript peut inférer le type de la variable.

const city = "Paris";
const department = 75;
const isCapital = true;
 
console.log(`Hello ${city}, department: ${department}`, isCapital ? "✨" : "");
export {}