Cheatsheet JavaScript – Niveau débutant

Introduction

Ce mois ci, l’article sera un mémo des notions essentielles en Javascript. On a beau connaitre le langage et l’utiliser, quand l’auto complétion ne fonctionne pas, ca devient compliqué. Personnellement j’ai toujours un doute dans la syntaxe exacte de certaines parties et je vais chercher sur internet pour la syntaxe exacte parce que « on sait jamais ».

J’ai donc regroupé sur une page toutes les notions de niveau débutant afin de tout avoir sous la main, page que je vous partage maintenant. Cette page comporte des exemples récupérés à droite et à gauche au fil du temps, cependant, je ne peux que vous conseiller de lire la documentation MDN qui est, je trouve, super complète afin d’avoir plus de détails : Guide JavaScript – JavaScript | MDN.

Les variables

			
let age = 25; // Variable modifiable
const PI = 3.14; // Constante (non modifiable)
var name = "CodeQueen"; // Anciennne façon de définir

Les types de données

Les types primitifs

Il y a 7 types primitifs en JavaScript.
Notez que seulement 6 sont présents ici, le type Symbol sera dans la version intermédiaire.

			
let str = "Hello"; // string
let num = 42; // number
let bool = true; // boolean
let undef; // undefined
let nul = null; // null
let big = 123n; // bigint

		

Vérifier un type

			
typeof "Hello"; // "string"
typeof 42; // "number"

Convertir des données

			
String(), .toString(), + "" //String	
Number(), parseInt(), parseFloat(), +value //Number	
Boolean(), !!value //Boolean	
Object() //Object	
Array.from(), split() //Array	
JSON.stringify() //JSON String	
JSON.parse() //Objet JS	

		

Les objets JSON

Création d’un objet JSON :

			
const user = {
  name: "Alice",
  age: 30,
  isAdmin: true
};

		

Accès et modifier les propriétés :

			
user.name;        // "Alice"
user["age"];      // 30
user.age = 31;          // modifier
user.email = "a@mail";  // ajouter
delete user.isAdmin;    // supprimer

		

Les opérateurs

			
+   // addition
-   // soustraction
*   // multiplication
/   // division
%   // modulo (reste)
>    // supérieur
<    // inférieur
>=   // supérieur ou égal
<=   // inférieur ou égal
&&  // et 
||  // ou
!   // négatif (non)

		

Les opérateurs d’égalité

			
==  // JavaScript essaie de convertir les types avant de comparer la valeur
=== // Compare la valeur et le type

Les tableaux

			
//création d'un tableau  
let arr = new Array();
let arr = [];
let fruits = ["Pomme", "Orange", "Banane"];
//récupérer un élément par sa position
alert( fruits[0] ); 
// remplacer un élément 
fruits[2] = 'Poire'; 
// ajouter un élément
fruits[3] = 'Kiwi'; 
// compter le nombre d'éléments d'un tableau 
alert( fruits.length ); 

		

Contrôle de flux et des erreurs

Les conditions

If… else

			
if (condition) {
instruction_1;
} else {
instruction_2;
}

		

If… else if

			
if (condition_1) {
  instruction_1;
} else if (condition_2) {
  instruction_2;
} else if (condition_n) {
  instruction_n;
} else {
  dernière_instruction;
}

		

Switch

			
switch (expression) {
  case label_1:
    instructions_1
    [break;]
  case label_2:
    instructions_2
    [break;]
  ...
  default:
    instructions_par_defaut
    [break;]
}

		

La gestion des erreurs

			
ouvrirFichier();
try {
  écrireFichier(données); // Une erreur peut se produire
} catch (e) {
  throw "monException"; // on génère une exception
} finally {
  fermerFichier(); // On n'oublie pas de fermer le flux.
}

		

Les boucles

Les boucles for

			
for (let pas = 0; pas < 5; pas++) {
  // Ceci sera exécuté 5 fois
  // À chaque éxécution, la variable "pas" augmentera de 1
  // Lorsque'elle sera arrivée à 5, le boucle se terminera.
  console.log("Faire " + pas + " pas vers l'est");
}

		

Les boucles while

			
let n = 0;
let x = 0;
while (n < 3) {
  n++;
  x += n;
}

		

Les boucles do while

			
let i = 0;
do {
  i += 1;
  console.log(i);
} while (i < 5);

		

Les fonctions

			
function addition(a, b) {
  return a + b;
}
addition(2, 3); //appel de la fonction
const addition = (a, b) => { //version simplifiée
  return a + b;
};
const addition = (a, b) => a + b; // version raccourcie

		

Si ca intéresse, une version intermédiaire et avancée pourrait voir le jour.
Au mois prochain !