[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.23,0:00:05.30,Default,,0000,0000,0000,,Maintenant, parlons un peu de quelque chose\Nque vous avez déjà beaucoup utilisé : les fonctions.
Dialogue: 0,0:00:05.34,0:00:11.13,Default,,0000,0000,0000,,A chaque fois que vous avez utilisé "rect()" ou "fill()", \Nvous avez appelé des fonctions.
Dialogue: 0,0:00:11.14,0:00:14.75,Default,,0000,0000,0000,,Et ces fonctions ont dessinés ce que vous\Nleur avez demandé.
Dialogue: 0,0:00:14.83,0:00:16.81,Default,,0000,0000,0000,,Qu'est-ce qu'une fonction ?
Dialogue: 0,0:00:16.81,0:00:20.18,Default,,0000,0000,0000,,C'est un ensemble de code qui est regroupé \Net auquel on donne un nom
Dialogue: 0,0:00:20.20,0:00:23.54,Default,,0000,0000,0000,,pour pouvoir le ré-utiliser plusieurs fois.
Dialogue: 0,0:00:23.54,0:00:26.18,Default,,0000,0000,0000,,Pensez un peu à la fonction "rect()".\NQu'est-ce qu'elle fait ?
Dialogue: 0,0:00:26.19,0:00:28.70,Default,,0000,0000,0000,,Elle dessine 4 lignes, n'est-ce pas ?
Dialogue: 0,0:00:28.70,0:00:31.51,Default,,0000,0000,0000,,On pourrait le faire en appelant \N4 fois la fonction "line()".
Dialogue: 0,0:00:31.62,0:00:34.10,Default,,0000,0000,0000,,Voilà... on obtient un rectangle.
Dialogue: 0,0:00:34.10,0:00:38.70,Default,,0000,0000,0000,,Mais on s'est rendu compte qu'on voulait\Nsouvent dessiner des rectangles.
Dialogue: 0,0:00:38.90,0:00:44.26,Default,,0000,0000,0000,,Et c'est assez ennuyeux d'avoir à calculer\Nà chaque la façon de dessiner les 4 lignes.
Dialogue: 0,0:00:44.63,0:00:49.23,Default,,0000,0000,0000,,Donc, on a créé une fonction "rect()" qui fait\Nexactement le dessin des 4 lignes.
Dialogue: 0,0:00:49.48,0:00:53.75,Default,,0000,0000,0000,,Du coup, on peut dessiner un rectangle \Navec beaucoup moins de code.
Dialogue: 0,0:00:54.60,0:01:02.14,Default,,0000,0000,0000,,C'est plutôt sympa ! "rect()" est l'une des fonctions\Nque l'on vous permet d'utiliser sur la Khan Academy
Dialogue: 0,0:01:02.26,0:01:07.25,Default,,0000,0000,0000,,Mais vous pouvez aussi créer vos propres\Nfonctions et les réutiliser dans vos programmes.
Dialogue: 0,0:01:07.71,0:01:13.92,Default,,0000,0000,0000,,Par exemple, imaginons qu'on fasse un programme\Net qu'on veuille dessiner Winston plusieurs fois.
Dialogue: 0,0:01:14.37,0:01:19.09,Default,,0000,0000,0000,,Car on souhaite raconter son histoire\Net le dessiner à plusieurs époques.
Dialogue: 0,0:01:19.22,0:01:23.65,Default,,0000,0000,0000,,Donc, voici à quoi peut ressembler le code\Npour dessiner le visage de Winston.
Dialogue: 0,0:01:24.07,0:01:28.52,Default,,0000,0000,0000,,On a les variables "faceX" et "faceY"\Npour déterminer le centre du visage.
Dialogue: 0,0:01:28.69,0:01:32.35,Default,,0000,0000,0000,,Et on dessine ses yeux et sa bouche \Nen fonction de ces deux variables.
Dialogue: 0,0:01:32.36,0:01:36.80,Default,,0000,0000,0000,,Pour l'instant, le programme analyse le code\Nqui n'est pas dans une fonction.
Dialogue: 0,0:01:37.14,0:01:40.83,Default,,0000,0000,0000,,Donc il l'exécute.\NIl l'exécute seulement une seule fois.
Dialogue: 0,0:01:41.01,0:01:43.91,Default,,0000,0000,0000,,OK. Transformons ça avec une fonction !
Dialogue: 0,0:01:43.94,0:01:48.42,Default,,0000,0000,0000,,Pour faire ça, cela ressemble à la façon\Nde définir une variable.
Dialogue: 0,0:01:48.69,0:01:54.50,Default,,0000,0000,0000,,On écrit : "var drawWinston"\N(on choisit un nom clair) ici, c'est\N"dessineWinston"
Dialogue: 0,0:01:54.50,0:01:56.44,Default,,0000,0000,0000,,Puis on écrit un signe égale ( = ).
Dialogue: 0,0:01:56.44,0:02:01.39,Default,,0000,0000,0000,,Ensuite, au lieu d'indiquer un nombre \Nou une chaine, on écrit : "function"
Dialogue: 0,0:02:01.49,0:02:05.100,Default,,0000,0000,0000,,(Attention à bien l'écrire)\NEnsuite deux parenthèses ( )
Dialogue: 0,0:02:06.06,0:02:10.63,Default,,0000,0000,0000,,Et enfin, deux accolades : { }\Net on termine par un point-virgule.
Dialogue: 0,0:02:10.75,0:02:18.54,Default,,0000,0000,0000,,Ce qu'il nous reste à faire, c'est de mettre\Ntout le code nécessaire à l'intérieur\Ndes accolades.
Dialogue: 0,0:02:18.54,0:02:23.18,Default,,0000,0000,0000,,Donc on prend tout ce code, là...\NEt on le mets dans la fonction...
Dialogue: 0,0:02:23.18,0:02:26.92,Default,,0000,0000,0000,,On indente le code (avec la touche Tabulation).\NEt... Voilà !
Dialogue: 0,0:02:26.92,0:02:30.55,Default,,0000,0000,0000,,Donc on a maintenant une variable qui\Ncontient une fonction.
Dialogue: 0,0:02:30.56,0:02:34.26,Default,,0000,0000,0000,,Dit autrement, on a donné un "nom"\Nà ce bloc de code.
Dialogue: 0,0:02:34.26,0:02:37.26,Default,,0000,0000,0000,,Ainsi, quand on en aura besoin, on pourra\Ndemander à notre programme...
Dialogue: 0,0:02:37.38,0:02:40.84,Default,,0000,0000,0000,,de chercher ce bloc de code,\Net de l'exécuter.
Dialogue: 0,0:02:40.84,0:02:43.96,Default,,0000,0000,0000,,Donc, ce bloc de code est maintenant\Nré-utilisable.
Dialogue: 0,0:02:43.96,0:02:49.46,Default,,0000,0000,0000,,Remarquez qu'on n'a plus le dessin de Winston.\NOn a perdu Winston ! Ou est-il passé ?
Dialogue: 0,0:02:49.59,0:02:54.07,Default,,0000,0000,0000,,OK. Ce qu'il s'est passé, c'est que quand on a \Nmis ce bloc de code dans la fonction,
Dialogue: 0,0:02:54.07,0:02:58.05,Default,,0000,0000,0000,,On a indiqué à l'ordinateur qu'on voulait\Npouvoir exécuter le code plus tard...
Dialogue: 0,0:02:58.14,0:03:01.18,Default,,0000,0000,0000,,et ne l'exécuter que quand on lui dira de le faire.
Dialogue: 0,0:03:01.18,0:03:04.47,Default,,0000,0000,0000,,Donc on a besoin maintenant de lui\Ndemander d'exécuter ce code.
Dialogue: 0,0:03:04.59,0:03:10.08,Default,,0000,0000,0000,,On dit, qu'on a besoin "d’appeler la fonction".\Nexactement comme on l'a fait pour rect() ou line().
Dialogue: 0,0:03:10.08,0:03:16.30,Default,,0000,0000,0000,,Pour ça, on écrit le nom de la fonction : drawWinston.\NPuis, nos deux parenthèses : ( )
Dialogue: 0,0:03:16.30,0:03:20.85,Default,,0000,0000,0000,,Et un point-virgule ;\NEt voilà ! Voilà notre Winston !
Dialogue: 0,0:03:21.10,0:03:22.78,Default,,0000,0000,0000,,C'est cool, ça !
Dialogue: 0,0:03:22.95,0:03:25.01,Default,,0000,0000,0000,,Bon. Peut être que vous \Nne trouvez pas ça si cool !
Dialogue: 0,0:03:25.13,0:03:29.13,Default,,0000,0000,0000,,Car on a finalement exactement\Nle même résultat qu'au début.
Dialogue: 0,0:03:29.45,0:03:33.45,Default,,0000,0000,0000,,Mais l'utilité des fonction est \Nqu'on peut les ré-utiliser.
Dialogue: 0,0:03:33.57,0:03:37.87,Default,,0000,0000,0000,,Donc, faisons ça maintenant.\NOn copie et colle l'appel de la fonction.
Dialogue: 0,0:03:37.99,0:03:43.50,Default,,0000,0000,0000,,Ici, et là... Hum...\NOn ne voit rien de différent !
Dialogue: 0,0:03:43.57,0:03:46.31,Default,,0000,0000,0000,,En fait, ça marche bien...
Dialogue: 0,0:03:46.38,0:03:50.72,Default,,0000,0000,0000,,Il dessine plusieurs Winston,\Nmais tous au même endroit !
Dialogue: 0,0:03:50.79,0:03:55.30,Default,,0000,0000,0000,,Si je pouvais voir avec des rayons X,\Nje verrais 3 Winstons.
Dialogue: 0,0:03:55.40,0:03:59.63,Default,,0000,0000,0000,,Malheureusement, ce n'est pas le cas...\NJe ne sais pas pour vous ? ! ?
Dialogue: 0,0:03:59.81,0:04:04.41,Default,,0000,0000,0000,,OK. On peut modifier un peu notre fonction\Npour rendre ça plus clair.
Dialogue: 0,0:04:04.50,0:04:08.50,Default,,0000,0000,0000,,Vous voyez ces deux variables faceX et faceY ?\NElles contiennent toujours 202 et 208.
Dialogue: 0,0:04:08.54,0:04:14.06,Default,,0000,0000,0000,,On peut changer ça pour utiliser un nombre\Naléatoire compris entre 50 et 350.
Dialogue: 0,0:04:14.18,0:04:18.98,Default,,0000,0000,0000,,Et on fait pareil pour faceY \Npour le rendre aléatoire aussi...
Dialogue: 0,0:04:19.24,0:04:23.92,Default,,0000,0000,0000,,Du coup, à chaque fois que la fonction est appelée\Ncela génère une position aléatoires différente.
Dialogue: 0,0:04:24.26,0:04:28.56,Default,,0000,0000,0000,,Si on appuie sur "Redémarrer", on obtient\N3 Winston à des endroits différents.
Dialogue: 0,0:04:28.80,0:04:31.12,Default,,0000,0000,0000,,OK !\NC'est génial ça !
Dialogue: 0,0:04:31.33,0:04:35.12,Default,,0000,0000,0000,,Car il aurait fallut beaucoup de lignes de code\Npour faire ça sans les fonctions.
Dialogue: 0,0:04:35.25,0:04:38.53,Default,,0000,0000,0000,,Il aurait fallut 3 fois plus de code !
Dialogue: 0,0:04:38.63,0:04:43.25,Default,,0000,0000,0000,,On peut encore améliorer ça...Car c'est pas sûr\Nqu'on ai besoin de le positionner aléatoirement !
Dialogue: 0,0:04:43.32,0:04:47.32,Default,,0000,0000,0000,,On préfère surement pouvoir le positionner\Nà l'endroit que l'on souhaite sur l'écran.
Dialogue: 0,0:04:47.46,0:04:51.46,Default,,0000,0000,0000,,Donc, regardez l'exposé suivant, car vous verrez\Ncomment passer des paramètres à la fonction.
Dialogue: 0,0:04:51.59,0:04:55.59,Default,,0000,0000,0000,,Et cela vous permettra de faire exactement ça !