Function Parameters | Computer Programming | Khan Academy

Nous voici revenus au programme qui dessine Winston,
auquel j'ai ajouté du texte.

Ce que je veux, c'est placer mes
Winston en dessous de chacune de ces étiquettes

pour que cela corresponde à
chaque période de sa vie.

Mais pour l'instant, il est placé
un peu partout,

car la fonction place Winston à une
position aléatoire pour faceX et faceY.

À la place, on veut indiquer
à la fonction à quelle position dessiner Winston.

Je veux pouvoir indiquer la position à chaque fois qu'on appellera la fonction.

comme pour les rectangles ou les ellipses.

OK. En fait, je veux pouvoir dessiner un Winston ici...
et ici... aussi ici... et là !

Je ne veux plus de position aléatoire à chaque appel.

Pour faire ça, on va spécifier des paramètres
à notre fonction...

à la fois, au moment de la définition
(tout en haut... ici)

et aussi au moment de l'appeler...
en bas...ici.

Dans "drawWinston()", on va lui passer
faceX et faceY,

et il pourra utiliser ces
valeurs au lieu de les générer aléatoirement.

Que va-t-on lui passer
comme valeurs au moment de l'appel.

On veut le positionner sous chaque bloc de texte.

Donc on va passer des valeurs proches
des x et y utilisés pour le texte.

Probablement 10 pixels
plus bas pour le y.

Le premier sera à peu près à 10 et 30,
puis... 200 et 30...

puis, 10 et 230... et enfin, 200 et 230.

Les mêmes que les textes
et j'ai ajouté 10 au y pour être un peu en dessous.

OK. Winston, lui, n'a pas bougé !

C'est parce qu'on n'a pas indiqué
à la fonction d'utiliser les paramètres.

Elle utilise donc toujours les valeurs aléatoires.

Donc pour lui dire d'utiliser les paramètres à la place,

on doit ajouter les noms des paramètres
entre les parenthèses... ici.

On va les appeler faceX et faceY... et les séparer
par une virgule.

On les appelle comme ça, car on utilise déjà ces
noms dans la fonction.

Cela nous évite de modifier
le code existant.

Mais, même en faisant ça,
Winston est toujours n'importe où !

Si vous regardez au début du code de la fonction,

vous voyez qu'on écrase les valeurs de
faceX et faceY avec des valeurs aléatoires !

Il faut donc qu'on enlève ces deux lignes, là.

Et voilà ! maintenant la fonction utilise
les valeurs de faceX et faceY,

qu'on lui a passées au moment de l'appel.

Je n'ai pas bien positionné
mes Winston pour l'instant,

car j'ai oublié que les x et y
des textes représentent le coin supérieur gauche

alors que pour le visage,
ils représentent le centre.

Donc je vais changer ça un peu...

Je vais changer pas mal le x... et le y pareil...
avec l'outil c'est plus facile...

Donc, j'ai juste à changer
les valeurs des paramètres de ma fonction.

Je n'ai plus à modifier la fonction elle-même.

Car elle va utiliser les valeurs que je lui passe.
Comme avec ellipse() et rect().

OK. Je les ai positionnés,
mais en fait, ils sont trop larges.

Ils se superposent. Ils prennent trop de place.

Comme j'ai fait une fonction pour les dessiner,
je peux modifier leur taille à tous,

juste en changeant une ligne de code !

Essayons de prendre la valeur 190, Yeah !
Ils vont maigrir d'un coup... 190.

C'est pas mal ! et si je modifie encore
un peu leur position, ça ira mieux.

Cool ! Bon.
Revoyons un peu ce que ce code fait.

On a définit une fonction appelée
"drawWinston()",

Cette fonction accepte 2 valeurs,
qu'on a nommées faceX et faceY.

Ces variables peuvent être utilisées
partout dans le reste de la fonction.

Exactement comme si on les
avait déclarées en haut normalement,

Et on peut appeler cette fonction
où on veut (après l'avoir déclarée)

et lui passer des valeurs
différentes en paramètres à chaque fois.

On vient de voir un truc super utile
avec les fonctions.

Quand on a du code qu'on pense
pouvoir réutiliser,

il suffit de le mettre dans une fonction.

Ensuite, on peut lui passer des paramètres

pour la personnaliser ou changer
son comportement.

C'est comme une recette.

Vous écrivez la recette pour un gâteau.
Mais si vous avez besoin d'en faire 4,

Vous n'avez pas à tout réinventer...
il suffit de tout multiplier par 4.

Maintenant vous pouvez commencez à réfléchir aux recettes dans votre code! miam !