Apprendre JS pas à pas
Les variables
Déclaration, affectation et portée des variables en JavaScript :
Déclaration de variables
- Utilisez
var
,let
ouconst
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
ouconst
à 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
etconst
: Utilisezlet
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ées | Description | Exemples |
---|---|---|---|
1. | Nombre | Représente les valeurs numériques | 42, 3.14, -10 |
2. | Chaîne de caractères | Représente une séquence de caractères | 'Bonjour', "JavaScript" |
3. | Booléen | Représente une valeur logique (true ou false) | true, false |
4. | Tableau | Collection ordonnée d'éléments | [1, 2, 3], ['a', 'b', 'c'] |
5. | Objet | Entité avec des propriétés et des méthodes | nom: 'John', age: 25 |
6. | Undefined | Indique qu'une variable n'a pas de valeur assignée | undefined |
7. | Null | Indique l'absence intentionnelle de valeur | null |
8. | Symbole | Identifiants uniques introduits dans ES6 | Symbol('description') |
9. | Objet Date | Représente une date et une heure spécifiques | new Date() |
10. | Objet RegExp | Utilisé pour les expressions régulières | /pattern/, new RegExp('pattern') |
11. | Fonction | Bloc de code réutilisable appelé avec un nom et des paramètres | function addition(a, b) return a + b; |
Les opérateurs
# | Opérateur | Description |
---|---|---|
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ôle | Description |
---|---|---|
1. | Structure conditionnelle if/else | Permet d'exécuter un bloc de code en fonction d'une condition. |
2. | Structure conditionnelle switch | Permet de sélectionner un bloc de code à exécuter parmi plusieurs cas. |
3. | Boucle for | Exécute un bloc de code un certain nombre de fois, basé sur une condition de contrôle. |
4. | Boucle while | Exécute un bloc de code tant qu'une condition donnée est vraie. |
5. | Boucle do...while | Exécute un bloc de code au moins une fois, puis continue tant qu'une condition donnée est vraie. |
6. | Boucle for...in | Parcourt les propriétés énumérables d'un objet. |
7. | Boucle for...of | Parcourt les éléments d'une structure itérable (tableau, chaîne de caractères, etc.). |
8. | Structure conditionnelle ternaire | Permet d'effectuer une condition en une seule ligne. |
9. | Instruction break | Termine l'exécution d'une boucle ou d'une instruction conditionnelle. |
10. | Instruction continue | Passe à l'itération suivante d'une boucle. |
Les fonctions
# | Fonction | Description | Cours 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