Javascript
JavaScript est un langage de programmation utilisé pour créer des applications web interactives et côté client. Il utilise un modèle de programmation asynchrone pour gérer les tâches en parallèle sans bloquer le fil d'exécution principal, et il est single Thread.
Event loop
L'Event Loop (ou boucle d'événements en français) est un mécanisme du modèle de programmation asynchrone de JavaScript. Il s'agit d'un processus qui s'exécute en arrière-plan et qui permet à JavaScript de gérer les événements et les tâches en parallèle, sans bloquer le fil d'exécution principal.
Lorsqu'un programme JavaScript est exécuté, toutes les tâches sont ajoutées à une pile d'appels (appelée "call stack" en anglais), qui est gérée par le moteur de JavaScript. Lorsque le moteur de JavaScript traite la pile d'appels, il exécute chaque fonction séquentiellement, en commençant par la fonction en haut de la pile.
Cependant, certaines tâches en JavaScript sont asynchrones, ce qui signifie qu'elles peuvent être exécutées indépendamment de la pile d'appels. Les exemples courants de tâches asynchrones incluent les événements de souris ou de clavier, les requêtes réseau.
C'est là que l'Event Loop entre en jeu. Lorsqu'une tâche asynchrone est en cours d'exécution, elle est placée dans une file d'attente appelée "queue" (ou "task queue" en anglais). Une fois que la pile d'appels est vide, l'Event Loop vérifie la file d'attente pour savoir si des tâches asynchrones sont en attente d'exécution. Si tel est le cas, l'Event Loop retire la tâche de la queue et la place sur callstack pour qu'elle soit exécutée.
Ce processus de mise en file d'attente et de traitement des tâches asynchrones se poursuit tant qu'il y a des tâches en attente dans la file d'attente. L'Event Loop permet ainsi à JavaScript de gérer les événements et les tâches en parallèle, sans bloquer le fil d'exécution principal et de maintenir une interface utilisateur réactive pour les utilisateurs.
Prototype
En JavaScript, chaque objet possède une propriété interne appelée [[Prototype]] qui est une référence vers un autre objet. Le prototype est utilisé pour établir la chaîne de prototypes, également connue sous le nom de chaîne d'héritage. L'objet référencé par [[Prototype]] est appelé le prototype de l'objet.
Prototype Chain
En JavaScript, chaque objet a une référence interne vers son prototype, qui est un autre objet. Le prototype d'un objet peut avoir son propre prototype, créant ainsi une chaîne de prototypes appelée "prototype chain".
Lorsqu'on accéde à une propriété d'un objet, JavaScript recherche d'abord cette propriété dans l'objet lui-même. Si la propriété n'est pas trouvée, JavaScript recherche la propriété dans le prototype de l'objet. Si la propriété n'est toujours pas trouvée, elle recherche la propriété dans le prototype du prototype, et ainsi de suite, jusqu'à ce que la propriété soit trouvée ou que la fin de la chaîne de prototype soit atteinte.
L'avantage de la chaîne de prototype est qu'elle permet aux objets de partager des propriétés et des méthodes. Par exemple, on peut créer un objet "Animal" avec des propriétés et des méthodes communes à tous les animaux, et créer ensuite des objets "Chien", "Chat", "Oiseau" qui héritent de l'objet "Animal". Cela évite de répéter du code et facilite la gestion de notre code.
Prototype Vs Chain
"prototype" fait référence à l'objet prototype d'une fonction constructeur ou d'un objet, tandis que "prototype chain" fait référence à la chaîne de prototypes qui est créée lorsqu'un objet est créé à partir d'un objet prototype. La chaîne de prototypes permet à chaque objet de partager des propriétés et des méthodes
Prototype Vs Héritage
Le prototype d'un objet est un objet qui sert de modèle pour la création d'autres objets. Lorsqu'un objet est créé à partir d'un prototype, il hérite des propriétés et des méthodes de ce prototype.elles permettent de créer des objets partageant des fonctionnalités communes sans avoir à répéter du code.
L'héritage, c'est un processus par lequel un objet hérite des propriétés et des méthodes d'un autre objet ou d'un prototype. En JavaScript, l'héritage se fait via la chaîne de prototypes.
Itérators(Iterateurs)
les itérateurs (ou "iterables") sont des objets qui fournissent une méthode next() pour parcourir une séquence d'éléments. Les itérateurs sont utilisés dans les boucles for...of pour parcourir des collections d'éléments tels que des tableaux, des chaînes de caractères, Un objet est considéré comme un itérateur s'il possède une méthode next() qui renvoie un objet avec deux propriétés : value, qui représente la valeur actuelle de l'itérateur, et done, qui indique si l'itération est terminée ou non.
Generator
Les générateurs (ou "generators") sont des fonctions qui permettent de créer des itérateurs personnalisés. Les générateurs sont créés avec le mot-clé function* et utilisent l'instruction yield pour renvoyer une valeur à chaque étape de l'itération.
Les générateurs peuvent être utilisés pour créer des séquences de valeurs à la volée ou pour créer des pipelines de traitement de données
Hosting
qui permet aux déclarations de variables et de fonctions d'être déplacées en haut de leur portée avant l'exécution du code. C'est-à -dire que les déclarations de variables et de fonctions sont "élevées" en haut de leur portée, avant tout autre code, même si elles sont déclarées plus tard dans le code.
Objet Mutable
Un objet mutable est un objet qui peut être modifié, dont on peut changer les propriétés une fois qu'il a été défini.
Objet Immutable
Les objets immuables (*immutable*) sont des objets dont l'état ne peut être modifié une fois l'objet créé.( Chaînes de caractères et nombres sont immuables.)
Ce concept permet de s'assurer de la valeur des variables du début à la fin de nos actions. Cela va permettre d'avoir un code plus robuste et plus stable, donc moins de bugs et moins de maintenances. Tout au long de notre script les variables ne peuvent être modifiées.
Programmation fonctionnelle
La programmation fonctionnelle est un paradigme de programmation qui traite le calcul comme l'évaluation de fonctions mathématiques. Elle évite les états changeants et les données mutables. En JavaScript, la programmation fonctionnelle est réalisable par à des fonctions de première classe et à des fonctions d'ordre supérieur.
Principe de programmation fonctionnelle
function pure, Immutabilité,Absence d'effets de bord, Composition des fonctions
Fonctions de première classe
Les fonctions sont des valeurs de première classe, ce qui signifie qu'on peut les assigner à des variables, les passer en tant qu'arguments et les retourner depuis d'autres fonctions.
Fonctions d'ordre supérieur Ce sont des fonctions qui prennent une ou plusieurs fonctions comme arguments, ou renvoient une fonction.(map,reduce, filter)
Composition de fonctions
Créez de nouvelles fonctions en combinant d'autres fonctions.
Function Pure
function Pure : est une fonction qui retourne toujours le même résultat pour des paramètres identiques, et qui ne dépend pas et ne modifie pas l'état des variables hors de sa portée. Elle n'a pas d'effets de bord, c'est-à -dire qu'elle ne modifie pas l'état de l'application à l'extérieur de la fonction.
Cela signifie que les fonctions pures ne peuvent pas effectuer d'actions qui ont des effets secondaires, comme l'envoi d'une requĂŞte HTTP.
En évitant les effets de bord, les fonctions pures sont plus faciles à comprendre, à tester et à raisonner, car leur comportement est prévisible et ne dépend pas de l'état global de l'application.
Function Impure
function impure est une fonction qui a au moins un effet de bord, c'est-à -dire qu'elle modifie l'état de l'application en dehors de la fonction elle-même.
Cependant, il est souvent nécessaire d'avoir des fonctions impures dans un programme, car il est souvent nécessaire de modifier l'état de l'application pour accomplir une tâche, comme la mise à jour d'une base de données
[DOC PROGRAMMATION FONCTIONNELLE](https://buzut.net/programmation-fonctionnelle-en-javascript/) – ([OTHER DOCS](https://grafikart.fr/tutoriels/programmation-fonctionnelle-878))
Side Effect
Effet de bord est une action réalisée par une fonction qui affecte l'état de l'application en dehors de la fonction elle-même. Autrement dit, un effet de bord est un effet indirect ou secondaire d'une fonction qui peut avoir des conséquences imprévues sur le comportement du programme.
Les fonctions pures sont un moyen de minimiser les effets de bord dans le code. En retournant toujours le même résultat pour des entrées identiques et en ne modifiant pas l'état de l'application à l'extérieur de la fonction, elles sont plus prévisibles, plus faciles à tester et à raisonner, et elles encouragent une organisation modulaire du code.
Closure
Closure de fonction permet (ça sert) à isoler une partie ou à vrai dire une variable dans ton programme, ce qui peut aider à éviter les collisions de noms et à rendre le code plus sûr.
Bind function
La fonction bind() est utilisée pour créer une nouvelle fonction qui, lorsqu'elle est appelée, a un this prédéfini. La méthode bind() renvoie une nouvelle fonction avec un contexte this lié à l'objet passé en argument lors de l'appel de bind().
Call function
Function Call est une méthode intégrée des fonctions qui permet d'appeler une fonction en spécifiant l'objet à utiliser comme valeur de this, ainsi que les arguments à passer à la fonction.
function Food(name, price) { Product.call(this, name, price); this.category \= 'food'; }
console.log(new Food('cheese', 5).name); // expected output: "cheese"
Apply function
est une méthode intégrée des fonctions qui permet d'appeler une fonction en lui passant une valeur this et des arguments sous forme d'un tableau.
La méthode apply() est similaire à la méthode call(), mais elle permet de passer les arguments sous forme d'un tableau plutôt qu'en tant que liste d'arguments séparés par des virgules
const numbers \= [5, 6, 2, 3, 7];
const max \= Math.max.apply(null, numbers);
console.log(max);
Call Vs apply VS Bind
La principale différence entre la méthode call() et la méthode apply() réside dans la façon dont les arguments sont passés à la fonction appelée.
La méthode call() prend une liste d'arguments séparés par des virgules, tandis que la méthode apply() prend un unique tableau d'arguments.
Cependant, la méthode apply() est plus pratique lorsque les arguments sont stockés dans un tableau ou lorsqu'on ne connaît pas à l'avance le nombre d'arguments à passer à la fonction.
—------- la méthode bind() est utilisée pour créer une nouvelle fonction avec une valeur de this spécifiée en permanence et des arguments pré-remplis.
—--------
Currying function
Curying est une technique de transformation de fonctions qui consiste à réécrire une fonction qui prend plusieurs arguments en une séquence de fonctions qui prend chacune un seul argument. Cela permet de fixer certains arguments de la fonction à l'avance, ce qui peut être très utile pour créer des configurations spécifiques de fonctions sans répéter du code. Le currying peut rendre le code plus expressif et réduire la redondance
Promise
Promise est un objet qui est utilisé pour réaliser des traitements de façon asynchrone. Une Promise représente une valeur qui peut être disponible maintenant, dans le futur ou jamais.
Une Promise peut être dans l'un des trois états suivants :
- pending (en attente) : C'est l'état initial de la Promise. Cela signifie que la promesse n'est ni remplie ni rompue. Elle est en attente de la réalisation d'une action asynchrone.
- fulfilled (tenue) : Cela signifie que l'opération asynchrone a réussi et que la Promise a été résolue avec une valeur.
- rejected (rompue) : Cela signifie que l'opération asynchrone a échoué et que la Promise a été rejetée avec une raison.
Une Promise peut également être dans l'état settled (acquittée), ce qui signifie que la promesse est tenue ou rompue mais qu'elle n'est plus en attente.
Callback
Callback est une fonction qui est passée en tant qu'argument à une autre fonction et qui est appelée ultérieurement lorsque cette fonction a fini de s'exécuter.
Le callback permet de gérer les opérations asynchrones en spécifiant une fonction à appeler une fois que l'opération asynchrone est terminée et que les résultats sont disponibles.
Callback Vs Promises
Callbacks et Promises sont deux mécanismes qui permettent de gérer l'exécution asynchrone du code en JavaScript. Voici les principales différences entre les deux :
- Syntaxe : Les callbacks sont des fonctions qui sont passées en tant qu'argument à une autre fonction. Les Promises sont des objets qui sont créés avec le constructeur Promise.
- Gestion des erreurs : Avec les callbacks, la gestion des erreurs peut être complexe et sujette à des problèmes de rappel en cascade (callback hell). Les Promises permettent une gestion plus facile des erreurs en utilisant les méthodes then() et catch() pour gérer les cas de réussite et d'échec.
- Enchaînement : Avec les callbacks, l'enchaînement de plusieurs opérations asynchrones peut être difficile et peut entraîner une indentation excessive du code (callback hell). Les Promises permettent un enchaînement plus facile des opérations asynchrones en utilisant les méthodes then() et catch() pour retourner de nouvelles Promises.
- Lisibilité du code : Les Promises peuvent rendre le code plus lisible et plus facile à comprendre en utilisant une syntaxe plus claire et en évitant les rappels en cascade (callback hell).
setTimeout Vs Promise
Les Promise sont exécutées dans la microtask queue (prioritaire), alors que setTimeout est dans la task queue.
Mode Strict
Le mode strict permet de choisir une variante restrictive de JavaScript. Le mode strict apporte quelques changements à la sémantique « normale » de JavaScript:
- Le mode strict élimine quelques erreurs silencieuses de JavaScript en les changeant en erreurs explicites (une exception sera levée).
- Le mode strict corrige les erreurs qui font qu'autrement il est difficile pour les moteurs JavaScript d'effectuer des optimisations. Le code sera donc exécuté plus rapidement en mode strict, sans changer une seule ligne si cela n'est pas nécessaire.
Reduce
Reduce() est un accumulateur" qui traite chaque valeur d'une liste (de gauche à droite) pour la réduire à une seule valeur. La méthode reduce() prend comme argument une fonction callback qui est exécutée sur chaque élément de la liste,
On peut également utiliser reduce() pour mettre en œuvre des fonctions de transformation et de filtrage, en utilisant la fonction de callabck pour exécuter la transformation ou le filtrage sur chaque élément de la liste avant de l'accumuler dans l'accumulateur.
Map
Map() est une méthode qui crée un nouveau tableau avec les résultats d'une fonction fournie sur chaque élément du tableau appelant.
La méthode map() prend en argument une fonction de rappel (callback) qui est exécutée sur chaque élément du tableau d'origine.
Filter
Filter() crée et retourne un nouveau tableau contenant tous les éléments du tableau d'origine qui remplissent une condition déterminée par la fonction callback.
La méthode Filter() prend en argument une fonction de rappel (callback) qui est exécutée sur chaque élément du tableau d'origine.
Le nouveau tableau peut avoir une longueur différente du tableau d'origine.
Some
Some() est une méthode de tableau qui permet de vérifier si au moins un élément d'un tableau satisfait une condition donnée par une fonction de test.
La méthode some() retourne finalement un booléen qui indique si au moins un élément du tableau satisfait la condition de recherche ou non. Elle retourne true si au moins un élément satisfait la condition, false sinon.
Find
La méthode find() renvoie la valeur du premier élément trouvé dans le tableau qui respecte la condition donnée par la fonction de test passée en argument. Sinon, la valeur undefined est renvoyée.(number > 3 pour trouver les nombres supérieurs à 3)
Fill
Fill() est une méthode qui permet de remplir tous les éléments d'un tableau avec une valeur statique.
La méthode fill() retourne finalement le tableau modifié avec les éléments remplis.
Slice
Slice() est une méthode des tableaux (Array) qui permet de créer une copie superficielle (shallow copy) d'une portion spécifique d'un tableau, sans modifier le tableau d'origine.
Elle renvoie un nouveau tableau contenant les éléments extraits du tableau d'origine.
Push
(element1, ..., elementN): Ajoute un ou plusieurs éléments à la fin du tableau.
Pop
Supprime le dernier élément d'un tableau et le retourne.
Shift
shift(): Supprime le premier élément d'un tableau et le retourne.
Unshift
unshift(element1, ..., elementN): Ajoute un ou plusieurs éléments au début du tableau.
Splice
(index, howMany, [element1[, ...[, elementN]]]): Change le contenu d'un tableau en supprimant, remplaçant ou ajoutant des éléments.
Concat
concat(array2, array3, ..., arrayN): Fusionne deux ou plusieurs tableaux
Object.assign
Object.assign() est utilisée afin de copier les valeurs de toutes les propriétés directes (non héritées) d'un objet qui sont énumérables sur un autre objet cible. Cette méthode renvoie l'objet cible.
La méthode Object.assign() prend au moins deux arguments : l'objet cible et un ou plusieurs objets sources. Elle copie les propriétés énumérables de chaque objet source dans l'objet cible, et écrase les propriétés existantes de même nom.
Object.freeze
Object.freeze() permet de geler un objet, c'est-à -dire qu'on empêche d'ajouter de nouvelles propriétés, de supprimer ou d'éditer des propriétés existantes. Toute tentative échouera, silencieusement ou via une exception TypeError (la plupart du temps en mode strict).
La méthode Object.freeze() prend en argument l'objet à geler. Elle modifie l'objet d'origine en le rendant immuable. Toutes les propriétés de l'objet sont rendues non modifiables et non supprimables
Object.entries Vs .fromEntries
Object.entries(obj) : transforme un objet en tableau de paires [clé, valeur].
Object.fromEntries(arr) : transforme un tableau [clé, valeur] en objet.
Object.seal
Il empêche l'ajout ou la suppression de propriétés. il permet toujours de modifier les valeurs des propriétés existantes.
Entries
La méthode entries() renvoie un nouvel objet de type Array Iterator qui contient le couple clef/valeur pour chaque éléments du tableau.
La méthode entries() retourne finalement un objet itérateur qui peut être utilisé pour parcourir les paires clé-valeur du tableau à l'aide de boucles for...of ou de méthodes d'itération telles que map(), filter(), etc.
Function
Une fonction est un processus qui prend une entrée, appelée arguments , et produit une sortie appelée valeur de retour . Les fonctions peuvent servir les objectifs suivants :
- Mappage : produit une sortie basée sur des entrées données. Une fonction mappe les valeurs d'entrée aux valeurs de sortie.
- Procédures : une fonction peut être appelée pour exécuter une séquence d'étapes. La séquence est connue sous le nom de procédure, et la programmation dans ce style est connue sous le nom de programmation procédurale .
- I/O : certaines fonctions existent pour communiquer avec d'autres parties du système, telles que l'écran, le stockage, les journaux système ou le réseau.
ES6
Les nouveautés de ES6
- Les variables déclarées let et const
- Les classes
- Modules(import / export)
- Les fonctions fléchées
- Paramètres par défaut pour les fonctions
- Rest paramètre
- Spread paramètre
- Les templates Strings (back sticks)
- Les destructuring
Const Vs Let Vs Var
CONST
- Const a besoin d'être déclaré avec une valeur initiale. La portée de const est celle du bloc
- On ne peut pas changer sa valeur après déclaration
- Avec const pour objet, on peut changer les propriétés d'un objet existant mais ne pas Réassigner un nouvel objet
- Const n'est pas hosting
LET
- Il n'est pas obligatoire de déclarer une variable avec sa valeur initiale.
- On peut modifier sa valeur après sa déclaration
- Elle est limitée à celle du bloc courant
- LET n'est pas hosting
VAR : permet de déclarer des variables qui ont une portée globale ou de fonction, c'est-à -dire qu'elles peuvent être utilisées partout dans le code à l'intérieur de leur portée. Les variables var peuvent être réaffectées avec une nouvelle valeur. Si une variable var est déclarée sans être initialisée, elle aura la valeur undefined.
Arrow Vs Regular function
La fonction fléchée à deux particuliers :
- La syntaxe est beaucoup plus rapide
- Elle va fixer la valeur de this automatiquement
Différence entre arrow et normal function
les principales différences entre les deux :
- Syntaxe : Les fonctions régulières sont définies à l'aide du mot-clé function, suivi du nom de la fonction et de ses paramètres entre parenthèses, puis du corps de la fonction entre des accolades {}. Les fonctions fléchées sont définies à l'aide de la notation () \=> {}, avec les paramètres entre les parenthèses et le corps de la fonction entre des accolades {}.
- Liaison du mot-clé this : Dans les fonctions régulières, le mot-clé this est déterminé par la façon dont la fonction est appelée, ce qui peut parfois causer des problèmes de liaison. Dans les fonctions fléchées, le mot-clé this est lié au contexte lexical dans lequel la fonction est définie, ce qui évite les problèmes de liaison.
- Utilisation de arguments : Les fonctions régulières ont accès à l'objet arguments, qui contient les paramètres passés à la fonction, ce qui n'est pas possible avec les fonctions fléchées.
REST Operator
L'opérateur REST(…variable) permet de convertir(ou transformer) la valeur libre(nombre indéfini) d'arguments sous forme d'un tableau.
SPREAD Operator
L'opérateur SPREAD, c'est l'inverse de l'opérateur REST, il prend le tableau, il va nous transformer ce tableau en valeur libre
Avec SPREAD, On pourra aussi créer un nouvel Tableau à partir d'un ancien
Destructruring
Destructuring qui permet d'extraire des données d'un tableau ou d'un objet grâce à une syntaxe dont la forme ressemble à la structure du tableau ou de l'objet.
- Destructuring Arrays
- Destructuring Objet
Remarque La différence entre destructuring tableau et Objet, Pour les tableaux on repose sur les notions d'ordre (on connait l'élément qui se trouve en première position, n position, quand on faisait une destructuring du tableau, on pouvait dire la variable a comme l'écrit en première elle va contenir la première valeur de mon Tableau) Dans les objets, il n'y a pas d'ordre, ce qu'important dans l'objet c'est de la propriété.
LocalStorage Vs SessionStorage
Différence entre LocalStorage et SessionStorage
localStorage et sessionStorage sont utiles pour la persistance d'informations non sensibles entre les pages.
| LocalStorage | SessionStorage | | ----- | ----- | | L'information est constamment stockée dans le navigateur, c'est-à -dire si l'utilisateur ferme le navigateur et rentre sur le Web, les informations seront toujours disponibles. | L'information ne dure que pendant la durée de session du navigateur. La fermeture de la fenêtre entraînera donc la perte de l'information. |
CORS
Le « Cross-origin resource sharing » (CORS) ou « partage des ressources entre origines multiples » (en français, moins usité) est un mécanisme qui consiste à ajouter des en-têtes HTTP afin de permettre à un agent utilisateur d'accéder à des ressources d'un serveur situé sur une autre origine que le site courant.
FETCH Vs XHR
On utilise XMLHttpRequest ou Fetch pour requêter des données JSON. L'API Fetch est une solution moderne qui vient remplacer XHR XHR bénéficie d'un très bon support sur les différents navigateurs. Fetch et les promesses, en revanche, sont un ajout plus récent à la plateforme web, bien qu'ils soient pris en charge par la plupart des navigateurs, Internet Explorer et Safari font exception.
Foreach Vs Map
En javascript, forEach est beaucoup plus lent que map Si je résume les différences clées entre les 2 façons de faire :
- map est plus performant que forEach
- map permet de gérer l'immutabilité car elle retourne un nouvel array — map permet de gérer l'immutabilité car elle retourne un nouvel array
- Vous êtes obligé de gérer avec la déstructuration d'array en ES6 pour gérer l'immutabilité du forEach
Substring Vs substr
- Les méthodes substring() et [slice()](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/String/slice) sont très proches mais certaines différences les distinguent, notamment la façon de gérer les arguments négatifs.
- La méthode substring() échangera les deux arguments si indiceA est supérieur à indiceB et renverra donc une chaîne de caractères. La méthode [slice()](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/String/slice) n'échange pas les arguments et renvoie donc une chaîne vide si le premier est supérieur au second
Axios Vs Fetch
- Axios effectue des transformations automatiques des données JSON .
- Fetch est un processus en deux étapes lors de la gestion des données JSON – d'abord, pour faire la demande réelle ; deuxièmement, pour appeler la méthode .json() sur la réponse.
For …of Vs …in
for...of et for...in sont deux méthodes pour parcourir des objets itérables tels que les tableaux et les objets.
- La boucle for...of est utilisée pour parcourir les valeurs d'un objet itérable
- La boucle for...in est utilisée pour parcourir les propriétés d'un objet itérable
Pomise All Vs Settled
En JavaScript, Promise.all et Promise.allSettled sont deux méthodes utilisées pour gérer plusieurs promesses simultanément, mais elles diffèrent dans leur comportement vis-à -vis des résultats et des erreurs des promesses qu'elles traitent.
Promise.all prend un tableau de promesses et retourne une nouvelle promesse qui résout lorsque toutes les promesses dans le tableau sont résolues ou rejette. Résolution : Si toutes les promesses dans le tableau sont résolues, Promise.all retourne une promesse qui résout avec un tableau contenant les valeurs de résolution de chaque promesse, dans le même ordre que les promesses fournies. Rejet : Si une des promesses dans le tableau est rejetée, Promise.all retourne immédiatement une promesse qui est rejetée avec la raison de rejet de la première promesse qui échoue. Elle ne attend pas que les autres promesses soient résolues ou rejetées.
Promise.allSettled prend un tableau de promesses mais retourne une promesse qui résout après que toutes les promesses données ont soit été résolues, soit rejetées. Cette méthode est utile lorsqu'on veut attendre la fin de toutes les promesses, indépendamment de leur résultat. Résolution : Promise.allSettled retourne toujours une promesse qui résout avec un tableau de résultats pour chaque promesse. Chaque résultat est un objet qui représente soit le succès soit l'échec de chaque promesse, contenant les propriétés status, value (pour les résolutions) ou reason (pour les rejets). Gestion des erreurs : Contrairement à Promise.all, Promise.allSettled ne rejette jamais en raison de l'échec d'une promesse dans le tableau. Elle permet de traiter chaque résultat individuellement après que toutes les promesses sont complétées.
Promise.race() retourne le premier résultat (réussi ou échoué).
Programmation Déclarative Vs Impératif
[Lien Ă voir](https://fr.acervolima.com/difference-entre-la-programmation-imperative-et-declarative/) - [Voir](https://blog.arcoptimizer.com/javascript-de-programmation-fonctionnelle)
La programmation déclarative est un paradigme de programmation où nous spécifions la logique du programme sans décrivant le contrôle de flux. La programmation déclarative concerne ce qu' faire pour obtenir un certain résultat. (Erlang, Haskell)
La programmation impérative est un paradigme de programmation où nous spécifions la logique du programme décrivant le contrôle de flux. La programmation impérative consiste à comment obtenir un certain résultat. Les langages de programmation Fortran, [Java](https://www.geeksforgeeks.org/java/) , [C](https://www.geeksforgeeks.org/c-programming-language/) , [C++](https://www.geeksforgeeks.org/c-plus-plus/) sont des exemples de programmation impérative.
Passage par Référence Vs Valeur
Par valeur En JavaScript, les valeurs de type primitif (tels que les nombres, les chaînes de caractères, etc.) sont copiées par valeur lorsqu'elles sont affectées à une variable ou passées en tant qu'argument à une fonction. Cela signifie que lorsque vous affectez une valeur de type primitif à une variable, une copie de cette valeur est créée et assignée à la variable. Si vous modifiez la valeur d'origine, cela n'aura aucun effet sur la valeur de la copie.
let x \= 2; let y \= x; // y contient une copie de la valeur de x (2)
x \= 3; // x contient maintenant une nouvelle valeur (3)
console.log(y); // affiche 2, car y contient toujours une copie de la valeur originale de x (2)
Par référence
Lorsque vous assignez une valeur à une variable en JavaScript en utilisant l'opérateur d'affectation "=", la variable ne contient pas une copie de la valeur, mais plutôt une référence à cette valeur. Cela signifie que si la valeur référencée est modifiée, la modification sera visible via toutes les variables qui référencent cette valeur. Dans le code que vous avez fourni, lorsque vous affectez la valeur de arr à arrayCopy, vous ne faites pas une copie de l'array, mais vous créez une référence à l'array existant. Lorsque vous modifiez l'array en ajoutant l'élément "banane" à l'aide de la méthode push(), cette modification est visible via toutes les références à cet array, y compris la référence arrayCopy. Pour créer une copie de l'array, vous pouvez utiliser la méthode slice() de l'objet Array ou utiliser l'une des méthodes de spread operator (...) de l'ES6.
En JavaScript, lorsque vous passez une valeur à une fonction en tant qu'argument, la valeur est copiée et passée à la fonction. Cependant, si vous passez une référence à un objet (c'est-à -dire une instance d'un objet créée en utilisant le mot-clé new ou une expression literal object), une référence à cet objet est passée à la fonction plutôt qu'une copie de l'objet lui-même. Cela signifie que si vous modifiez l'objet à l'aide de la référence dans la fonction, ces modifications seront visibles en dehors de la fonction.
ES7
Les nouveautés de ES7
- L'opérateur pour l'exponentiation:
Cet opérateur vous permet d'élever un nombre à la puissance d'un autre. C'est essentiellement un raccourci pour Math.pow().
- Array.prototype.includes:
La méthode includes() détermine si un tableau contient un certain élément, renvoyant true ou false selon le cas.
ES8
- ## Async/Await
les fonctions async et await, qui simplifient la manipulation des opérations asynchrones et les promesses.
Ces méthodes ont été ajoutées pour faciliter l'accès aux valeurs et aux entrées (paires clé-valeur) d'un objet.
- ## String padding
les méthodes padStart et padEnd pour les chaînes de caractères, permettant d'ajouter du remplissage au début ou à la fin d'une chaîne.
- ## Object.getOwnPropertyDescriptors()
Cette méthode retourne un objet dont les propriétés sont des descripteurs de toutes les propriétés propres (non héritées) d'un objet donné.
Deep copy et shallow copy
Shallow copy : copie de premier niveau. Les objets imbriqués ne sont pas copiés.
Deep copy : copie récursive de tous les niveaux.
Event delegation
Plutôt que d'ajouter des listeners à chaque élément enfant, on les ajoute sur le parent et on intercepte les événements qui "bubblent".
Nullish coalescing
a ?? b retourne a si a n'est pas null ou undefined, sinon retourne b.
Bubbling/capturing/Target
Capturing phase : l'événement descend du document vers la cible.
Target phase : l'événement atteint l'élément cible.
Bubbling phase : l'événement remonte de la cible jusqu'au document.
Par défaut, les événements écoutés se produisent en phase de bubbling (addEventListener sans capture: true).
Debouncing/Throttling
- Debouncing : attend une période d'inactivité pour exécuter la fonction.
- Throttling : limite l'exécution d'une fonction à un appel toutes les X ms.
Utilisation :
- Throttle : scroll, resize events.
- Debounce : input search, autocomplete.
HasOwnProperty Vs in
- hasOwnProperty teste uniquement les propriétés propres (pas héritées).
- in teste les propriétés propres et les propriétés héritées.
WeakMap et WeakSet
- WeakMap : clefs objets non comptées dans le GC (Garbage Collector).
- WeakSet : pareil pour ensembles.
Utile pour stocker des données privées ou des références légères sans empêcher l'objet d'être détruit.
Quand obj est supprimé, weakMap libère sa valeur automatiquement.