TypeScriptLeçon 6 sur 16

Alias de types et unions

Le mot-clé type donne un nom à n'importe quel type, et | réunit plusieurs types en une union. Une valeur de ce type peut être n'importe lequel de ses membres.

L’essentiel

type ID = number | string : la valeur est un nombre ou une chaîne.
Avant une vérification, seules les opérations communes à tous les membres sont permises.
Après typeof id === "string", TypeScript sait qu'il s'agit d'une chaîne dans le if.
type et interface décrivent tous deux des objets ; seul type peut nommer une union.

Exemple

type ID = number | string;type Point = { x: number; y: number }; function showId(id: ID): string {  if (typeof id === "string") {    return `ID ${id.toUpperCase()}`; // here id is a string  }  return `ID #${id}`; // and here it is a number} const start: Point = { x: 0, y: 0 }; console.log(showId(42));console.log(showId("ab-7"));console.log(`Start: ${start.x},${start.y}`);

Dans le if, id a toUpperCase car c'est forcément une chaîne. Après ce return, il ne reste que number. Point est un simple type objet nommé.

Exercice

Utiliser l’éditeur⌘ Entrée ou Ctrl Entrée lance le code, ⇧ ⌘ Entrée vérifie l’exercice.Tab et Maj Tab indentent la ligne ou la sélection ; Échap puis Tab quitte l’éditeur.La vérification compare ce que le programme a affiché à l’exercice ; les espaces en fin de ligne ne comptent pas.Après deux vérifications ratées, la solution s’ouvre. Votre code reste dans ce navigateur.

Autorisez Price à être un nombre ou une chaîne, convertissez les chaînes avec parseFloat, ajoutez "12.50" au tableau et affichez « 499, 1250, 300 » et « Sum: 2049 ».

// TODO: a price can be a number or a string, e.g. "12.50" from a formtype Price = number; function toCents(price: Price): number {  // TODO: if price is a string, turn it into a number with parseFloat  return Math.round(price * 100);} // TODO: put the string "12.50" between 4.99 and 3const prices: Price[] = [4.99, 3];const cents = prices.map(toCents); console.log(cents.join(", "));// TODO: print "Sum: ..." with the sum of all cents

// TODO: a price can be a number or a string, e.g. "12.50" from a form
type Price = number;

function toCents(price: Price): number {
  // TODO: if price is a string, turn it into a number with parseFloat
  return Math.round(price * 100);
}

// TODO: put the string "12.50" between 4.99 and 3
const prices: Price[] = [4.99, 3];
const cents = prices.map(toCents);

console.log(cents.join(", "));
// TODO: print "Sum: ..." with the sum of all cents

Sortie

Ce que le programme affiche apparaîtra ici.