TP 0 - Introduction en NodeJS et TypeScript

Installation et configuration

Editeur de texte - Visual Studio Code

  1. Entrez sur le site de Visual Studio Code et appuyez sur le bouton Download
  2. Exécutez le programme d'installation
  3. Ouvrez l'application

Pour créer un nouveau projet en Visual Studio Code, on va procéder de la manière suivante:

  • Créez un dossier TP0 sur votre Desktop. C'est ici que vous allez placer tous les fichiers où vous allez résoudre les exercices
  • Entrez en VSCode, appuyez sur FileOpen Folder… et sélectionnez le dossier que vous venez de créer
  • Pour créer un nouveau dossier, vous devez appuyer sur le bouton indiqué par la flèche rouge
  • Pour créer un nouveau fichier, vous devez appuyer sur le bouton indiqué par la flèche verte

tp1-1.jpg

  • Pour pouvoir exécuter les programmes, on aura besoin d'une ligne de commande, appelée Terminal

tp1-2.jpg

NodeJS

  • Naviguez vers http://www.nodejs.org
  • Téléchargez NodeJS version 14 LTS pour votre système d'exploitation (Windows/Linux/Mac)
  • Exécutez le programme d'installation
  • Redemarrez VSCode
  • Pour vérifier si NodeJS a été installé avec succes, saisissez les commandes suivantes dans le Terminal:
      node -v
      npm -v
 
  • Votre output devrait ressembler au suivant:

tp1-3.jpg

TypeScript

TypeScript est un langage open source qui s'appuie sur JavaScript, l'un des outils les plus utilisés au monde, en ajoutant des définitions de type statiques.

Les types fournissent un moyen de décrire la forme d'un objet, en permettant à TypeScript de valider que le code fonctionne correctement.

TypeScript peut etre installé directement depuis le Terminal, à l'aide de la commande suivante:

   npm install typescript -g

Si vous utilisez Linux en tant que systeme d'exploitation, vous devez ajouter sudo devant la commande précédente.

Configuration nouveau projet

  1. Créez un nouveau dossier
  2. On doit créer un fichier nommé package.json, alors tapez la commande npm init dans le terminal. L'utilitaire va vous demander de fournir des informations sur le nouveau projet afin de remplir certains champs. Il faut tout simplement appuyer sur la touche Enter pour associer les valeurs par défaut.
  3. On doit créer aussi un fichier de configuration pour TypeScript, tsconfig.json. La commande à exécuter dans le terminal est tsc --init.
  4. A l'aide de l'interface graphique de Visual Studio Code, créez un nouveau fichier index.ts
  5. Dans le Terminal, exécutez la commande tsc index.ts. Cela générera le fichier .js correspondant. Ce fichier ne doit pas entre modifié, il sera utilisé seulement pour la compilation, car en reste on va travailler seulement avec les fichiers TypeScript
  6. Pour exécuter le programme, saisissez la commande node index.js.

Pour certaines versions de système d'exploitation, il est très probable que vous rencontrez l'erreur suivante lorsque vous essayez de démarrer le programme: tsc: cannot be loaded because running scripts is disabled on this system. Pour résoudre ce problème, vous devez suivre les étapes suivantes:

  1. Démarrez Windows PowerShell en tant qu'administateur
  2. Saisissez la commande suivante: Set-ExecutionPolicy -ExecutionPolicy RemoteSigned
  3. Redémarrez VSCode et exécutez de nouveau le programme

Types de données

Primitives

  • boolean: valeur true/false
         let isDone: boolean = false;
 
  • number: numéros enters et réels, dans la base 10, 8 ou 16
          let decimal: number = 6;
          let hex: number = 0xf00d;
          let binary: number = 0b1010;
          let octal: number = 0o744;
 
  • string: texte qui doit etre entouré par ” ou '
          let color: string = "blue";
          color = 'red';
 
  • enum: pour mapper des valeurs numériques sous des noms plus accessibles
          enum Color {
            Red,
            Green,
            Blue,
          }
          let c: Color = Color.Green;
 
  • never: décrit une action qui ne se passe jamais, pour le moment utilisé pour les fonctions qui ne retournent rien
           function error(message: string): never {
              throw new Error(message);
           }
 
  • void: l'absence de tout type, généralement vu comme le type de retour des fonctions qui ne retournent pas de valeur
           function sendWarning(): void {
              console.log("This is my warning message");
           }
 
  • autres types: bigint, symbol, null, undefined

Non-Primitives

  • array: liste de valeurs ayant le meme type
          let list: number[] = [1, 2, 3];
          let list: Array<number> = [1, 2, 3];
 
  • tuple: un array de dimension fixe, ou les valeurs on de différents types
          let x: [string, number];
          // Initialize it
          x = ["hello", 10]; // OK
 
          // Initialize it incorrectly
          x = [10, "hello"]; // Error
 
  • object: tout ce qui n'est pas number, string, boolean, bigint, symbol, null ou undefined
          let obj: { obj_property: string; } = { obj_property: "simple_object" };
 

Variables

Les variables sont utilisées pour stocker des données. Pour les déclarer, nous utiliserons l'un des mots-clés let ou const.

  • let permet la déclaration de variables dont la portée est limitée au bloc dans lequel elles sont déclarées; aucune nouvelle déclaration n'est acceptée
let x: number = 10;
let x: number = 20; // error: can't re-declare 'x' in the same scope
function f(x) {
  let x = 100; // error: interferes with parameter declaration
}
 
for(let i: number = 0; i< 2; i++)
{
     let b: number = 2;
     console.log(i+b);
}
// Output: 2, 3
console.log(b) => error: b is not defined
  • const est similaire à «let», la différence étant que la valeur des variables ne peut pas être modifiée une fois qu'elle a été définie; ils ont les mêmes scoping rules, seules les réaffectations ne peuvent pas être effectuées
const user_id = 9;
const user = {
  name: "Aurora",
  id: user_id,
};
 
// Erreur causée par l'essai d'assigner une nouvelle valeur a la constante 'user'
user = {
  name: "Danielle",
  id: user_id,
};
 
// Opération correcte, les champs de l'objet ne représentent pas de constantes, ils peuvent etre mis a jour
user.name = "Tania";
user.name = "John";
user.id--;

Modules

Un module contient un ensemble de fonctions qui peuvent etre incluses dans une application afin d'utiliser des fonctionnalités plus complexes.

Pour installer des modules, on utilise npm install. Le drapeau –save les ajoutera automatiquement au fichier package.json (pour une installation globale, on utilise -g):

Example:

npm install lib_name --save

Pour pouvoir utiliser tous les types de NodeJS, on devra exécuter dans le Terminal la commande npm install @types/node –save-dev.

Pour inclure un module installé dans l'application, avant de commencer a utiliser ce module il faut l'importer de la maniere suivante:

import * as module_name from 'module_name';

Lire le contenu d'un fichier

Pour lire le contenu d'un fichier, on utilise le module fs, de la façon suivante:

import * as fs from 'fs';
 
let file_content: string;
try {
    file_content = fs.readFileSync('./test.txt', 'ascii');
    console.log(file_content);
} catch(error) {
    console.log(error);
}

Ecrire dans un fichier

import * as fs from 'fs';
 
let to_write: string = "sample text";
try {
    fs.writeFileSync('./test.txt', to_write);
} catch(error) {
    console.log(error);
}

Instructions conditionnelles

En TypeScript, nous avons les instructions conditionnelles suivantes:

  • if - pour spécifier un bloc de code à exécuter, si la condition est vraie
  • else - pour spécifier un bloc de code à exécuter, si la même condition qua est fausse
  • else if - pour spécifier une nouvelle condition à tester, si la première condition est fausse
  • switch - pour spécifier plusieurs blocs de code alternatives à exécuter

If

let x: number = 1;
if(x === 1) {
   console.log(x); //l'instruction s'execute
}
if(x > 3) {
   console.log(x + 3); //l'instruction ne s'execute pas
}

Pour vérifier que 2 valeurs sont identiques, vous devez utilizer l'opérateur === qui, par rapport a l'opérateur classique == réalise une vérification aussi en type et en valeur.

If Else

let x: number = 5;
 
if(x < 3) {
   console.log(x + 3);
}
else {
   console.log(x + 1); //seulement cette instruction s'execute
}

If Else if

let x: number = 2;
 
if(x < 3) {
   console.log(x + 3); //seulement cette instruction s'execute
}
else if (x > 4){
   console.log(x + 1);
}

Switch

let x: number = 2;
 
switch(x) {
   case 1:
      console.log(x + 1);
      break;
   case 2:
      console.log(x + 2); //seulement cette instruction s'execute
      break;
   case 3:
      console.log(x + 3);
      break;
   default:
      console.log(x); //instruction qui s'execute si x n'est pas egal a 1, 2 ou 3
   }

Boucles

Les boucles peuvent exécuter un bloc de code plusieurs fois.

For

La boucle for parcourt un bloc de code un certain nombre de fois.

let x: number= 10;
let sum: number = 0;
 
for(let i = 1; i <= x; i++) {
   sum += i;
}
 
console.log(sum); //55

For in

L'instruction for in itère sur les propriétés énumérables d'un objet. Pour chaque propriété distincte, les instructions peuvent être exécutées.

let array: number[] = [5, 7, 2, 9, 3]
 
for(let i in array) {
   console.log("Value " + array[i] + " at index " + i);
}
 
/* Output:
Value 5 at index 0
Value 7 at index 1
Value 2 at index 2
...
*/

For of

L'instruction for of permet de créer une boucle qui parcourt un objet itérable et qui permet d'exécuter une ou plusieurs instructions pour la valeur de chaque propriété.

let array: number[] = [5, 7, 2, 9, 3]
 
for(let i of array) {
   console.log("Value " + i);
}
 
/* Output:
Value 5
Value 7
Value 2
...
*/

While

La boucle while parcourt un bloc de code tant qu'une condition spécifiée est vraie.

let x:number = 1;
let sum:number = 0;
 
while(x <= 10) {
   sum += x;
   x++;
}
 
console.log(sum); //55

Opérateurs

Operateur Description Example
+ Plus x + y
- Moins x - y
* Multiplication x * y
/ Division x / y
% Reste de la division x % y
== Valeur d'égalité x == y
=== Égalité de la valeur et du type x === y
!= Valeur différente x != y
!== Différence de la valeur ou du type x !== y
< Moins grand x < y
Moins grand ou égal x ⇐ y
> Plus grand x > y
>= Plus grand ou égal x >= y
! Pas !x
&& Et x && y
|| Ou x || y
& AND x & y
| OR x | y
~ NOT x ~ y
^ XOR x ^ y
» Right Shift x » y
« Left Shift x « y

Excercices

  1. Ecrivez un programme qui affiche sur l'écran:
    • Votre nom et prénom en utilisant l'opération de concaténation (0.2p)
    • La date d'aujourd'hui en format ISO 8601, en utilisant les objets JavaScript Date. (0.4p)
    • La date et l'heure en Paris, en utilisant le module moment-timezone. (0.4p)
  2. A l'aide du module http et de l'API gratuit de Cat Facts, créez une requête de type GET. Vous devez afficher sur l'écran le message contenu dans le champ text pour l'objet ayant l'id “58e008780aac31001185ed05”. (1.5p)
  3. Soit la variable const numbers = [1, 2, 3, 4];. Créez un programme qui affiche chaque élément de la liste numbers après une seconde. Indice: utilisez de module timers. (1p)
  4. Faites un nouveau projet qui s'appelle systeminfo. Inspectez la documentation du module os et utilisez-le pour afficher les données suivantes (Attention! L'installation du module n'est pas nécessaire, il suffit d'importer le module dans le projet):
    1. le repertoire de base pour l'utilisateur actuel(home directory) (0.3p)
    2. la disponibilité du système (uptime) (0.3p)
    3. la mémoire disponible en MB (0.4p)
  5. A l'aide des modules fs et os, écrivez dans le fichier os.info toutes les informations suivantes: (1p)
    1. la mémoire disponible en KB
    2. le type du système d'exploitation
    3. la version du noyau
    4. les données sur chaque cœur de processeur logique
  6. Installez le module chalk (version 4.1.0), en utilisant npm, de sorte que le module soit ajouté automatiquement en package.json. Affichez toutes les variables de l'exercice précédent avec des couleurs différentes, en utilisant le module chalk. (1p)
  7. Stockez un nombre quelconque dans une variable. Utilisez la boucle while pour compter seulement ses diviseurs pairs. Affichez sur l’écran :
    1. “I chose the number x which has y even divisors”, où x représente la valeur du numéro que vous avez choisi et y le numéro de ses diviseurs (0.5p)
    2. Si le nombre est premier. (0.5p)
  8. Faites un projet qui s'appelle boucles. En utilisant les différents types de boucle for et tout autre module nécessaire, résolvez les demandes suivantes :
    1. lisez 10 numéros d'un fichier txt et affichez leur somme et leur moyenne (0.4p)
    2. affichez sur l'écran la table de multiplication du numéro 5 (1×5=5, 2×5=10, 3×5=15 … 10×5=50) (0.4p)
    3. vérifiez si le numéro 56 est un parfait (la somme des diviseurs est égale a 56) (0.4p)
    4. vérifiez si un numéro est Strong. (Un nombre Strong est un nombre spécial dont la somme des factorielles de chiffres est égale au nombre d'origine: 1! + 4! + 5! = 145 (0.4p)
    5. une pyramide d'étoiles avec 4 lignes (0.4p)
                  * 
                 * * 
                * * * 
               * * * *
    6. la pyramide suivante (0.5p)
           1234567654321                                                                                            
            12345654321                                                                                             
             123454321                                                                                              
              1234321                                                                                               
               12321                                                                                                
                121                                                                                                 
                 1 
alf/laboratoare/00.txt · Last modified: 2022/02/27 17:59 by diana.ghindaoanu
CC Attribution-Share Alike 3.0 Unported
www.chimeric.de Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0