Aller au contenu principal

Apprendre JS pas à pas

Les variables

Déclaration, affectation et portée des variables en JavaScript :

Déclaration de variables

  • Utilisez var, let ou const pour déclarer une variable.

Affectation de variables

Utilisez = pour attribuer une valeur à une variable.

Portée des variables

  • Variables globales : Déclarées à l'extérieur de toutes les fonctions, accessibles partout.
  • Variables locales : Déclarées à l'intérieur d'une fonction, accessibles uniquement à l'intérieur de celle-ci.
  • Variables avec portée de bloc (ES6+) : let ou const à l'intérieur d'un bloc de code délimité par des accolades {} (closure/fermeture), limitées à ce bloc.
  • Hoisting (hissage) : Les déclarations de variables var uniquement sont hissées en haut de leur portée lors de l'exécution du code, mais pas leur initialisation.

Recommandations :

  • Préférence pour let et const : Utilisez let pour les variables réaffectables, const pour les variables dont la valeur ne change pas.
  • Limitez la portée : Déclarez les variables dans la portée la plus étroite possible.
  • Nommez les variables de manière explicite : Utilisez des noms significatifs pour faciliter la compréhension.
  • Initialisez les variables : Affectez une valeur initiale dès la déclaration.

Type de données

FlashCard

#Type de donnéesDescriptionExemples
1.NombreReprésente les valeurs numériques42, 3.14, -10
2.Chaîne de caractèresReprésente une séquence de caractères'Bonjour', "JavaScript"
3.BooléenReprésente une valeur logique (true ou false)true, false
4.TableauCollection ordonnée d'éléments[1, 2, 3], ['a', 'b', 'c']
5.ObjetEntité avec des propriétés et des méthodesnom: 'John', age: 25
6.UndefinedIndique qu'une variable n'a pas de valeur assignéeundefined
7.NullIndique l'absence intentionnelle de valeurnull
8.SymboleIdentifiants uniques introduits dans ES6Symbol('description')
9.Objet DateReprésente une date et une heure spécifiquesnew Date()
10.Objet RegExpUtilisé pour les expressions régulières/pattern/, new RegExp('pattern')
11.FonctionBloc de code réutilisable appelé avec un nom et des paramètresfunction addition(a, b) return a + b;

Les opérateurs

#OpérateurDescription
1.Opérateurs arithmétiques+, -, *, /, %
2.Opérateurs de comparaison

| 3. | Opérateurs logiques | &&, ||, ! | | 4. | Opérateurs d'assignation | =, +=, -=, *=, /=, %= | | 5. | Opérateurs d'incrémentation | ++, -- | | 6. | Opérateur de concaténation | + | | 7. | Opérateur ternaire | condition ? expression1 : expression2 | | 8. | Opérateurs de bitwise | | | 9. | Opérateur de concaténation de chaînes de caractères | += | | 10. | Opérateurs d'appartenance | in, instanceof | | 11. | Opérateur de sélection | . | | 12. | Opérateurs de test de type | typeof, instanceof | | 13. | Opérateurs de décalage | | | 14. | Opérateur de suppression | delete | | 15. | Opérateur de résolution de portée | :: | | 16. | Opérateurs de regroupement | (), [], {} |

Structure de contrôle

#Structure de contrôleDescription
1.Structure conditionnelle if/elsePermet d'exécuter un bloc de code en fonction d'une condition.
2.Structure conditionnelle switchPermet de sélectionner un bloc de code à exécuter parmi plusieurs cas.
3.Boucle forExécute un bloc de code un certain nombre de fois, basé sur une condition de contrôle.
4.Boucle whileExécute un bloc de code tant qu'une condition donnée est vraie.
5.Boucle do...whileExécute un bloc de code au moins une fois, puis continue tant qu'une condition donnée est vraie.
6.Boucle for...inParcourt les propriétés énumérables d'un objet.
7.Boucle for...ofParcourt les éléments d'une structure itérable (tableau, chaîne de caractères, etc.).
8.Structure conditionnelle ternairePermet d'effectuer une condition en une seule ligne.
9.Instruction breakTermine l'exécution d'une boucle ou d'une instruction conditionnelle.
10.Instruction continuePasse à l'itération suivante d'une boucle.

Les fonctions

#FonctionDescriptionCours et exemples

| 1. | Fonction déclarative | Déclare une fonction avec le mot-clé function. | Cours : function nomFonction() { // Code }
Exemple : function afficherMessage() { console.log("Bonjour !"); } |

| 2. | Fonction avec paramètres | Permet de passer des valeurs à une fonction en utilisant des paramètres. | Cours : function nomFonction(param1, param2) { // Code } Exemple : function additionner(a, b) { return a + b; } | | 3. | Fonction avec retour de valeur | Renvoie une valeur calculée par la fonction avec le mot-clé return. | Cours : function nomFonction() { return valeur; } Exemple : function carre(nombre) { return nombre * nombre; } | | 4. | Fonction anonyme | Fonction sans nom, souvent utilisée comme argument d'une autre fonction. | Cours : (function() { // Code })(); Exemple : (function() { console.log("Fonction anonyme exécutée !"); })(); | | 5. | Fonction fléchée | Syntaxe simplifiée pour déclarer une fonction. | Cours : () => { // Code } Exemple : const multiplier = (a, b) => a * b; | | 6. | Fonction récursive | Appelle elle-même pour effectuer des opérations répétitives. | Cours : function nomFonction() { nomFonction(); } Exemple : function compteur(numero) { if (numero > 0) { console.log(numero); compteur(numero - 1); } } | | 7. | Fonction de rappel (callback) | Fonction passée en argument à une autre fonction pour être appelée ultérieurement. | Cours : function fonctionPrincipale(callback) { // Code ; callback(); } Exemple : function afficherMessage(callback) { console.log("Bonjour !"); callback(); } afficherMessage(() => console.log("Fin du programme")); | | 8. | Fonction auto-exécutante (IIFE) | S'exécute immédiatement après sa définition. | Cours : (function() { // Code })(); Exemple : (function() { console.log("Fonction auto-exécutante !"); })(); |

Fonction déclarative

  • Une fonction déclarative est définie à l'aide du mot-clé function.
  • Elle peut avoir un nom pour être réutilisée ultérieurement.
function afficherMessage() {
console.log("Bonjour !");
}

afficherMessage(); // Appel de la fonction