Тёмный

Programmation asynchrone en JavaScript: Événements, Callbacks, Promises, async-await 

Morgan Schmiedt
Подписаться 3 тыс.
Просмотров 12 тыс.
50% 1

Cette vidéo explique le fonctionnement de la programmation synchrone et asynchrone sur le Web, notamment en JavaScript. Les concepts d'événements, de Callback, de Promise, et les nouveaux mots clés async et await sont présentés et expliqués.
Le code source est disponible à cette adresse : github.com/MorganSchmiedt/you...
Sommaire:
00:00 Introduction
0:29 Programmation synchrone
3:56 Programmation asynchrone
12:49 Programmation asynchrone avec des Callbacks
24:47 Programmation asynchrone avec des Promises
34:24 Programmation asynchrone avec async et await
---
Vous pouvez m'écrire en laissant un commentaire en bas de cette vidéo, en me contactant sur Twitter (@Morgan_Schmiedt) ou en m'envoyant un e-mail à l'adresse: mon-prénom@mon-nom.fr
Les commentaires qui ne sont pas écrits correctement, pas respectueux ou pas constructifs sont supprimés.

Наука

Опубликовано:

 

22 июл 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 50   
@MorganSchmiedt
@MorganSchmiedt 4 года назад
Programmation synchrone 0:29 Programmation asynchrone 3:56 Programmation asynchrone en utilisant des Callbacks 12:49 Programmation asynchrone en utilisant des Promises 24:47 Programmation asynchrone en utilisant les mots clés Async et await 34:24
@marcelehuyambianguessan5510
@marcelehuyambianguessan5510 3 месяца назад
Honnêtement après avoir papoté plus d'une heure sur RU-vid, c'est la première vidéo qui m'explique vraiment clairement les choses
@mustaphabousellam746
@mustaphabousellam746 Год назад
J'ai suivi plusieurs vidéos concernant le sujet. Mais franchement vos êtes le meilleur car vous expliquez tellement bien les choses que finalement il est presque impossible de ne pas comprendre. En plus vous abordez toutes ces trois notions (callback, promise, et await) d'une manière chronologique tout en faisant le lien et les différences entre elles. Un grand merci
@yourkaa5670
@yourkaa5670 2 года назад
Tu es un ouff mec 😱 ton intelligence pédagogique est au-dessus de la moyenne!!
@soufianeaknouche2508
@soufianeaknouche2508 Год назад
Merci Morgan pour les éclaircissements quant aux différentes façons de faire de l'asynchrone.
@frankdearr2772
@frankdearr2772 6 месяцев назад
Excellente video, merci pour ce sujet vraiment utile 👍
@chr_aikicom
@chr_aikicom Год назад
excellente explication 😊
@Greg-dn5rt
@Greg-dn5rt Год назад
Bien expliqué merci. 🤏🏾 Par contre ton fond d'écran on dirait un cours de magie lol
@Cilloux972
@Cilloux972 2 года назад
C'est super bien expliqué ! Je m'abonne !
@jacquesderiban557
@jacquesderiban557 2 года назад
Vous faites un excellent travail pédagogique. Vous méritez bien plus de vues et d'abonnés. Merci.
@storm-technologie
@storm-technologie Год назад
franchement je suis vraiment déçus, mais vraiment déçus de ne pas t'avoir connus plus tôt 😅, merci , les choses sont très bien expliquer et sa ma donner envie de voir plusieurs de tes vidéos 👍👍
@MorganSchmiedt
@MorganSchmiedt Год назад
Les grands esprits finissent toujours par se rencontrer 😝
@emmanuelcronenberger5027
@emmanuelcronenberger5027 Год назад
Merci pour ton travail tu expliques avec beaucoup de clarté 👍
@sofianesofiane1831
@sofianesofiane1831 2 года назад
Merci Monsieur ,,👍
@josiassehi.keassebo6020
@josiassehi.keassebo6020 Год назад
Bonjour a vous , je tiens a vous remercier pour ce excellent travail 🤗 tres tres complet et facile a comprendre
@soundhiker
@soundhiker 2 года назад
Merci Morgan pour cette vidéo parfaitement claire... j'ai du lire un paquet d'article et regarder pas mal de vidéos avant d'enfin tomber sur celle là qui est limpide. Bravo !
@pelletierchristophe21
@pelletierchristophe21 2 года назад
Bonjour, Je vous remercie pour votre vidéo ; j'avais investi dans des livres, regardé des tutos sur le sujet sans vraiment bien comprendre ; là, vos explications sont accessibles pour un débutant ! Merci beaucoup de prendre le temps pour ces vidéos. C'est très appréciable.
@ryanthibaux7011
@ryanthibaux7011 2 года назад
Merci pour cette vidéo, et le mini best-of à la fin qui permet de décompresser après un bourrage de crâne ! :')
@kira2935
@kira2935 3 месяца назад
magnifique
@tropic44
@tropic44 2 года назад
Merci pour tes efforts de pédagogie
@espinozagaye6242
@espinozagaye6242 2 года назад
Merci pour les explications je viens de découvrir mais c’est top je comprends petit à petit
@laurentgauthier8742
@laurentgauthier8742 2 года назад
Un grand merci pour ces contenus et l'effort pédagogique qui est derrière. D'ailleurs, la remarque s'applique aussi à toutes les vidéos de la chaîne que j'ai pu visionner jusqu'à maintenant, Je continue, tout devient de plus en plus clair ! Merci encore.
@philippedevezeaud5029
@philippedevezeaud5029 2 года назад
Bonne explications, clair. Merci pour le partage
@lexplay4019
@lexplay4019 3 года назад
mec je te remercie, j'ai planché pendant 3 jours non stop. J'avais compris pourquoi on devait les utiliser mais comment utiliser ces outils, j'en étais incapable. Maintenant je vois un peu mieux et en plus tu as un léger accent alsacien ce qui m'a facilité le travail ^^'. Je pense que je vais jeter un coup d'oeil sur tes autres vidéos et merci encore
@louisvandevelde
@louisvandevelde 3 года назад
Bravo, magnifique vidéo, du grand art.
@electroheadfx
@electroheadfx 3 года назад
Franchement tu es le seul qui m'a fait bien comprendre les notions, merci !
@MorganSchmiedt
@MorganSchmiedt 3 года назад
Merci Laurent. Content que ca te plaise.
@olivier8556
@olivier8556 3 года назад
Excellente vidéo ! merci beaucoup
@saminserge2674
@saminserge2674 2 года назад
Merci pour vos excellentes videos . une tres bonne continuation a vous !
@theot4562
@theot4562 3 года назад
Top ton travail. Cela m'a beaucoup aidé !
@jipeejoce1353
@jipeejoce1353 2 года назад
Tuto exceptionnel (et je pèse mes mots), merci pour vos efforts, +1 abo :)
@raphaelparodi3377
@raphaelparodi3377 3 года назад
Tout simplement , merci ! :)
@raph6709
@raph6709 3 года назад
Merci c'était très clair!
@flaks7831
@flaks7831 3 года назад
super tuto merci beaucoup je m'abonne :)
@MorganSchmiedt
@MorganSchmiedt 3 года назад
Merci - content que ca te plaise 😊
@maureenbayedi4031
@maureenbayedi4031 3 года назад
Super tuto
@theot4562
@theot4562 3 года назад
Petit clin d'oeil pour le best-off a la fin de la vidéo XD
@MorganSchmiedt
@MorganSchmiedt 3 года назад
Hehe ;)
@far1006
@far1006 4 года назад
👍
@___Kevin
@___Kevin 2 года назад
Merci beaucoup pour vos explications parce que c'est pas super évidemment comme concept
@Sdirimohamedsalah
@Sdirimohamedsalah 3 года назад
Merci pour cette explication en profondeur ! Question : comment faire pour créer un logique basé sur le temps. Par exemple on attend la réponse (avoir le nom) si l'utilisateur ne répond pas au bout de 5 secondes par exemple on lui donne une deuxième question en occurrence lui demandant son prénom?
@MorganSchmiedt
@MorganSchmiedt 3 года назад
Avec plaisir! Pour effectuer une opération après un certain laps de temps, vous pouvez utiliser la fonction native setTimeout. J'en parle ici : ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-YKOoAEt_XcE.html
@soufianta8374
@soufianta8374 3 года назад
Bonsoir. Je ne veux pas être développeur mais je suis une sorte d’administrateur système. Du coup, je fais quelques scripts et je maintiens/déploie des applications web. J’aime les langage style Ruby, python mais je commence à m’intéresser à js car c’est le langage du net! Nodejs est une excellente manière de sortir du « net ». Est-ce que nodejs est l’alternative parfaite à python etc. (pour faire du web et automatisation). Merci et bonne continuation..
@MorganSchmiedt
@MorganSchmiedt 2 года назад
Je ne sais pas si NodeJS est l'alternative parfaite à Python, mais c'est une des alternatives avec PHP. Tout dépend ce que tu veux faire. L'avantage de NodeJS est de pouvoir écrire des programmes (scripts, backend Web, etc.) en JavaScript avec le même langage de programmation que celui utilisé sur le front-end, pour les sites Web. On peut donc apprendre un seul langage et réutiliser ses compétences pour différentes finalités.
@theot4562
@theot4562 3 года назад
Salut ​ @Morgan Schmiedt , Je sais pas si tu peux m'aider. Mais j'ai un souci et je suis bloqué.... Voici mon code : (La function ‘’req_sql ’’ devras lancer une requête SQL et par la suite récupérer le résultat de la requête.) /// MYSQL /// var mysql = require('mysql'); var bdd = mysql.createConnection({ host : '192.168.1.10', user : 'paul', password : '123456789', database : 'bourse' // Changer le nom de la database }); const req_sql = (req) =>{ return bdd.query(req,function(err, result) { if (err) throw err // console.log(result) return result }); } console.log( req_sql('select * from tickers where symbol = "XPAR:TEP";'))
@MorganSchmiedt
@MorganSchmiedt 3 года назад
Hey - Tu ne m'as pas dit quel était le problème exactement. Le mieux est d'essayer de localiser le problème pour essayer de savoir si le soucis vient de : 1/ JavaScript, càd d'une erreur dans le code ; 2/ SQL, càd un problème dans la requête SQL, ou dans la structure de la table ; 3/ La base de données, càd une erreur de connexion, d'identifiant, ou de mot de passe ; Le code me semble correct. (Le point virgule à la fin de la requête n'est pas nécessaire) Pour confirmer la validité de la requête SQL, tu peux copier/coller ta requête en te connectant manuellement à la base et en l’exécutant. Pour confirmer la connexion à la base, tu peux aussi essayer de te connecter manuellement, avec les mêmes identifiants. Je suis surpris de voir que l'adresse (host) fait référence à une IP fixe, et ne fait pas référence à localhost (ou 127.0.0.1), car dans la majorité des cas, la base est localisée sur la même machine.
@theot4562
@theot4562 3 года назад
@@MorganSchmiedt Hey merci pour ta réponse ! Le problème provient du return BDD.Query. Seul une erreur et les identifiants de connexion est retournée. La requête SQL fonction très bien car le console.log(résult) (qui est en commentaire) m’affiche le résultat. Je pense que le problème réside vraiment dans la manière donc je retourne les valeurs. Merci pour ton temps 😉
@MorganSchmiedt
@MorganSchmiedt 3 года назад
Si le "console.log" qui est en commentaire fonctionne, la connexion à la BD fonctionne et ta requête aussi. Pour récupérer le résultat de ta fonction "req_sql", tu ne peux pas simplement appeler la fonction "req_sql()" comme tu le fais et espérer avoir le résultat en retour, car le résultat de la fonction n'est pas synchrone, càd qu'il n'est pas disponible immédiatement. Le résultat est disponible seulement quand le callback est appelé, càd lorsque la fonction que tu transmets à "bdd.query" est executée. Aussi, il n'y a pas d'intérêt de retourner le résultat dans le callback ("return result"), car il n'est pas possible de récupérer le résultat de cette manière. Pour récupérer le résultat, il faudrait soit passer un callback à la fonction "req_sql", soit utiliser async/await. Par exemple : const req_sql = (req, cb) => bdd.query(req, (err, result) => { if (err) throw err cb(result) }) req_sql('select ...', (result) => console.log(result))
@theot4562
@theot4562 3 года назад
​@@MorganSchmiedt Est - il possible de récupérer la valeur au niveau de l'appelle de la fonction pour la stocker dans une variable . exemple : retour = req_sql('select * from tickers where symbol = "XPAR:TEP";', (result) => (result)) console.log(retour) avec "retour" qui contient le résultat de la requête ? Merci pour ton temps ;)
@MorganSchmiedt
@MorganSchmiedt 3 года назад
Oui c'est possible en utilisant une les Promise et async/await, comme je l'explique dans la vidéo. Il faut insérer ta fonction "req_sql" dans une Promise. Tu pourras ensuite l'utiliser comme une fonction synchrone en mettant : result = await req_sql(sql)
Далее
Créer un modèle de page sous Node.js (#7) (ExpressJS)
40:35
Украшаю чехлы 🎀
00:51
Просмотров 132 тыс.
Ranking The Most Painful Crashes
00:19
Просмотров 2 млн
The Async Await Episode I Promised
12:04
Просмотров 1,1 млн
Améliorer le CSS avec le langage SASS (#5)
53:40
Просмотров 1,9 тыс.
Javascript | Promise
32:26
Просмотров 17 тыс.
JavaScript Pro Tips - Code This, NOT That
12:37
Просмотров 2,5 млн
Samsung laughing on iPhone #techbyakram
0:12
Просмотров 661 тыс.
Самый быстрый пылесос!
0:30
Просмотров 23 тыс.
Собираем комп за 500 000 рублей!
6:44:35