--- tags: ironhack --- Qu'est-ce qu'une fonction de callback ? === ==C'est une fonction passée en paramètre== (à une autre fonction), comme dans cet exemple où une fonction est passée à `.addEventListener` : ```js= btnEl.addEventListener('click', function () { alert("Just clicked the button !!!"); }); console.log("THE END") ``` > :bulb: notre fonction de callback est ici une fonction anonyme, ie: sans nom Ici, dans l'ordre, nous verrons s'afficher : - le message `THE END` dans la console - une boite de dialogue `Just clicked !!!` chaque fois que l'utilisateur cliquera sur le lien de la page. --- Même si comme on le sait déjà notre programme javascript est lu de haut en bas, on comprend que : :::warning Toutes nos lignes de code ne sont pas forcément exécutées dans l'ordre où elles sont écrites. 🙃 ::: Eg, ici la ligne L2 de notre `alert()` interviendra après les autres : ``` L1 › L3 › L4 › L5 ⌚ L2 ``` Ceci est justement dû à notre fonction de callback passée en paramètre de `.on`, **qui ne sera exécutée que plus tard** : au moment du `"click"` de l'utilisateur. En conclusion --- Les fonctions de callback sont fondamentales dans nos interfaces, puisqu'elles permettent à du code d'être exécuté **plus tard dans le temps** ⌚ en réponse à des actions à venir de l'utilisateur. Elles présentent également l'avantage pour le programme de ne pas rester "bloqué" en attendant le `"click"` de l'utilisateur, mais au contraire de pouvoir faire autre chose en attendant : comme de contrôler une animation dans la page, faire une requete ajax...etc. On parle du caractère **non-bloquant** du code de la fonction de callback --- NB : Pour aller plus loin http://learn.ironhack.com/#/learning_unit/6746