la grande différence/feature des arrows functions c'est surtout que le this est hérité du parent et ça évite de faire des .bind(this) ou des that = this
@@melvynxdev je pense que la réponse de codip780 a plus de sens. Ce qui est décrit dans la vidéo sur le hoisting provient de la différence déclaration/affection. Toutes les déclarations sont hoistées, les affectations sont exécutées dans l'ordre du fichier. La déclaration d'une function est un cas particulier où la déclaration et l'affectation ne sont qu'une instruction 💡
Excellente vidéo et super explication pour la call stack un régal 😍 Par contre info importante mais tu as oublié le point virgule dans ton exemple à la min 7 ce qui change tout sinon ça renvoi bien pareil 😅
Super merci pour ces infos ! J'ai vu que ton console.log s'affichait dans ton IDE. Peux-tu partager ce plug-in ? D'avance merci, je me suis abonné super contenu !
Du coup, est-ce qu'on utilise le prototype pour qu'une fonction de secours soit appelée au cas où la première n'arrive pas à l'être pour une obscure raison ?
Merci pour cette vidéo ! En revanche, sur les arrow function je suis tombé sur quelqu'un qui expliquait la différence d'interprétation de 'this' par rapport à une regular function... je pense avoir compris, quoique... ! (j'espère avoir été assez clair dans mon explication). Aurais-tu un avis sur le sujet afin de m'éclairer un peu, merci !
Le mot clé this dans une regular function dépend de la manière dont la function est applée, exemple tu peux '.call()' / '.bind()' this d'un autre context pour y faire référence dans ta régular function, alors qu'une fonction fléché n'a pas 'son propre this', elle utilise le 'this' de l'environnement dans le quel elle est créée, tu pourra essayer de call() ou autre le this d'une fonction fléché pour le redéfinir cela ne marchera pas, en gros les fonctions régulières ont un this qui est flexible (avec un .call() ou autre tu peux appeler this d'un autre contexte alors qu'avec une fonction fléchée this hérite obligatoirement du contexte parent.
Salut Melvynx, mdr, je ne connaissais pas le terme HOF. Le concept, bien sûr que oui. Mais pas le terme exact. Merci :) Pour comprendre le principe de prototype, il faut se replonger dans le passé puisque avant si tu voulais faire de "l'objet", c'était en prototype (c'est du pseudo objet). Après, il y avait pas mal de solutions annexes. Mais le problème, tu n'avais pas une uniformisation de la syntaxe/méthodo/philosophie . Avant, certains disaient que le JS est un langage objet. Or, c'était un abus de langage. Le problème que tu peux rencontrer en faisant du prototype, c'est que tu as la fameuse ambiguïté du this. Je vais le déterrer… Quand tu voulais étendre une fonctionnalité de jQuery, c'était de mémoire, une syntaxe similaire à prototype. ;) Pour comprendre les closures, il faut aussi comprendre la portée des variables. Mais attention au contexte. Tout le monde pense que les mots const et class viennent de ES2015. Or c'est faux. C'est nettement plus vieux que ça. Mais les navigateurs ne les prenaient pas en compte !
Oui, en effet, c'est un des motifs de l'introduction du mot-clef "class" dans javascript, de pouvoir définir des fonctions directement sans avoir à les affecter explicitement au prototype de la fonction constructeur
la grande différence/feature des arrows functions c'est surtout que le this est hérité du parent et ça évite de faire des .bind(this) ou des that = this
il fallait dire 1 seul différence dans ma question ;)
@@melvynxdev je pense que la réponse de codip780 a plus de sens.
Ce qui est décrit dans la vidéo sur le hoisting provient de la différence déclaration/affection.
Toutes les déclarations sont hoistées, les affectations sont exécutées dans l'ordre du fichier.
La déclaration d'une function est un cas particulier où la déclaration et l'affectation ne sont qu'une instruction 💡
Oui les fonctions arrow sont bound au contexte ou elle sont déclarés automatiquement.
Il veut avoir réponse à tout sans admettre ces erreurs
Super vidéo, tu as quoi comme extension pour que tes console.log() s'affichent directement dans l'éditeur de code ?
console Ninja
quokka oui
Excellente vidéo et super explication pour la call stack un régal 😍
Par contre info importante mais tu as oublié le point virgule dans ton exemple à la min 7 ce qui change tout sinon ça renvoi bien pareil 😅
ah merde, merci beaucoup, dommage que je ne puisse pas modifier
T’en fais pas j’avais compris ton exemple. Toujours au top tes schémas explicitifs 🔥
Merci c'est vraiment utile pour les entretiens.
Merci trop cool !
Merci Melvyn. Ta video est super sympa. Je ne comprenais pas tout cela. J'ai même partagé à ma mère qui a kiffé à donf ton tuto de ouf. 😂👌🏼👍🏼💪🏼
Ahaha merci beaucoup 🤣🤣🤣
salut !
à 7:09 t'as oublié le ";" du coup les deux fonction return pareil et ensuite dans ton exemple il y est donc la c'es différent
ah mince
Vraiment cool. Meri beaucoup. Mais dis qu'est ce que tu utilise qui met les carrés vert a coté de ton code ?
C'est quokka un plugin disponible dans vscode qui permet d'avoir l'affichage du résultat du code comme si l'on faisait un console.log dans la console
@@elie8181 je ne parle pas de ça mais des carré vert a gauche du code
Ahh d'accord merci
@@elie8181
quooka oui
Merci@@melvynxdev
Quel plugin vous utilisez pour avoir le résultat sur la droite de la fonction sur vs ?
C'est natif avec un settings
dans vscode > setting.json ? @@melvynxdev
J'ai regardé la vidéo sur VS Code (ou désintalle-le) mais j'ai pas trouvé
Super merci pour ces infos !
J'ai vu que ton console.log s'affichait dans ton IDE.
Peux-tu partager ce plug-in ?
D'avance merci, je me suis abonné super contenu !
il me semble que c'est console ninja
quokka oui
Du coup, est-ce qu'on utilise le prototype pour qu'une fonction de secours soit appelée au cas où la première n'arrive pas à l'être pour une obscure raison ?
non il faut pas trop l'utiliser le proptoype c'est une mauvaise pratique
@@melvynxdevlol, donc en entretien on risque de poser une question sur un truc qui n'est pas utilisé ? La question piège ptdr ! 😂
exacte
Est-ce que tu as un exemple de cas concret où le prototype est plus utile qu'une méthode directement rajoutée dans la classe ?
non
A quoi ça sert alors ?
Merci pour cette vidéo ! En revanche, sur les arrow function je suis tombé sur quelqu'un qui expliquait la différence d'interprétation de 'this' par rapport à une regular function... je pense avoir compris, quoique... ! (j'espère avoir été assez clair dans mon explication). Aurais-tu un avis sur le sujet afin de m'éclairer un peu, merci !
Le mot clé this dans une regular function dépend de la manière dont la function est applée, exemple tu peux '.call()' / '.bind()' this d'un autre context pour y faire référence dans ta régular function, alors qu'une fonction fléché n'a pas 'son propre this', elle utilise le 'this' de l'environnement dans le quel elle est créée, tu pourra essayer de call() ou autre le this d'une fonction fléché pour le redéfinir cela ne marchera pas, en gros les fonctions régulières ont un this qui est flexible (avec un .call() ou autre tu peux appeler this d'un autre contexte alors qu'avec une fonction fléchée this hérite obligatoirement du contexte parent.
oui, ici il fallait que je mentionne qu'une seul différence et this aurait pris toute la vidéo donc j'ai choisis le hoisting
Franchement super bien expliqué
merci !
Salut Melvynx,
mdr, je ne connaissais pas le terme HOF. Le concept, bien sûr que oui. Mais pas le terme exact. Merci :)
Pour comprendre le principe de prototype, il faut se replonger dans le passé puisque avant si tu voulais faire de "l'objet", c'était en prototype (c'est du pseudo objet). Après, il y avait pas mal de solutions annexes. Mais le problème, tu n'avais pas une uniformisation de la syntaxe/méthodo/philosophie . Avant, certains disaient que le JS est un langage objet. Or, c'était un abus de langage. Le problème que tu peux rencontrer en faisant du prototype, c'est que tu as la fameuse ambiguïté du this.
Je vais le déterrer… Quand tu voulais étendre une fonctionnalité de jQuery, c'était de mémoire, une syntaxe similaire à prototype. ;)
Pour comprendre les closures, il faut aussi comprendre la portée des variables. Mais attention au contexte.
Tout le monde pense que les mots const et class viennent de ES2015. Or c'est faux. C'est nettement plus vieux que ça. Mais les navigateurs ne les prenaient pas en compte !
effectivement, tu as raison pour le this mais je demandais qu'une seul différence !
@@melvynxdev Je t'ai envoyé un mail
Merci Melvynx
Merci à toi !
La fonction addeventlister est donc une HOF?
Oui c'est ça
À 13:21 la méthode bark est directement dans le prototype non ?
Oui, en effet, c'est un des motifs de l'introduction du mot-clef "class" dans javascript, de pouvoir définir des fonctions directement sans avoir à les affecter explicitement au prototype de la fonction constructeur
exactement
@@GuillaumeDenry Yes merci !
J’ai partagé ça à ta mère 😎
Super vidéo comme dab ! par contre tu laisse 5 sec pour comprendre un truc et tu met 1 min à l’expliquer mdr 🤣
ah bah merci xD Tu as raison oui mais tu peux mettre pause
Merci a Melvin par ce que je n'ai jamais rien compris a l'ordinateur. Partager a la mere.
ah oui
Merci frère 🤜🏾🤛🏾
merci !
Génial merci :D
merci à toi !
comment vs code peut afficher le resulat de la console.log() dans vs code? extension? copilot? 7:30
oui copilot
@@melvynxdevmerci boss
Mais oui c'est clair !
Trop cool !
Tout tes postes LinkedIn et Twitter de la semaine haha
Tu es bon toi !
Cool
cooool
Il faut la meme vidéo mais pour ts 🤓
Oui trop bonne idée !!!