WEBVTT 00:00:00.000 --> 00:00:05.038 Nous avons déjà créé une première variable pour la taille des yeux de Winston. 00:00:05.038 --> 00:00:10.076 Cela nous permet de changer la taille de ses yeux très facilement maintenant. 00:00:10.076 --> 00:00:14.927 Avant, on devait changer le même nombre quatre fois pour faire ça ! 00:00:15.097 --> 00:00:18.540 Peut-on utiliser les variables même si les nombres ne sont pas tous les mêmes ? 00:00:18.540 --> 00:00:21.456 Que dois-je faire pour changer sa position un petit peu ? 00:00:21.496 --> 00:00:27.472 Il faudrait modifier toutes les coordonnée X mais elles n'ont pas toutes la même valeur ! 00:00:27.472 --> 00:00:30.545 Bon. Une fois que je défini une variable qui contient une valeur... 00:00:30.545 --> 00:00:33.618 je peut l'utiliser partout pour remplacer ce nombre. 00:00:33.618 --> 00:00:36.693 Je peux donc l'utiliser aussi dans des expressions pour faire des calculs. 00:00:36.693 --> 00:00:40.462 Bon. Comment ça marche ? Créons une variable pour la coordonnée X. 00:00:40.462 --> 00:00:43.024 on écrit "var x" 00:00:43.024 --> 00:00:47.744 C'est simple. OK. Elle doit contenir la coordonnée X du visage. 00:00:47.744 --> 00:00:51.339 Le visage est dessiné à la coordonnée X qui vaut 200. 00:00:51.339 --> 00:00:54.423 Donc on indique que "x contient 200" 00:00:55.053 --> 00:00:58.334 Maintenant, je peux remplacer ce nombre par ma variable "x". 00:00:58.334 --> 00:01:01.615 Et quand je change sa valeur, cela bouge son visage. 00:01:01.615 --> 00:01:04.896 Par contre, ça ne bouge ni ses yeux, ni sa bouche. 00:01:04.896 --> 00:01:09.910 Pour faire ça, on va calculer la position de ses yeux et de sa bouche... 00:01:09.910 --> 00:01:14.924 ... RELATIVEMENT à la position du visage. 00:01:14.924 --> 00:01:19.940 La coordonnée X de chaque ellipse correspond à son centre. Pour le visage... 00:01:19.940 --> 00:01:28.603 ... c'est 200. Commençons par son oeil gauche. Cette ligne avec l'ellipse est celle de l'oeil gauche, positionnée à 150. 00:01:28.603 --> 00:01:32.865 Donc... par là... c'est 150. 00:01:32.865 --> 00:01:37.556 Et je sais que 150, c'est 200 moins 50. 00:01:37.592 --> 00:01:42.360 Donc la position de l'oeil gauche est celle du visage MOINS 50. 00:01:42.360 --> 00:01:46.894 Donc, c'est "x" (la position du visage) moins 50. 00:01:46.894 --> 00:01:52.950 Et maintenant, si je change la valeur de "x", l'oeil se déplace avec le visage. 00:01:52.864 --> 00:01:54.206 Faisons l'autre oeil. 00:01:54.206 --> 00:02:01.302 Son oeil droit est dessiné à... 300. Donc... par là... c'est 300. 00:02:01.302 --> 00:02:05.214 Et 300, c'est 200 plus 100. 00:02:05.214 --> 00:02:09.902 Donc la position de l'oeil droit est celle du visage PLUS 100. 00:02:09.902 --> 00:02:12.535 C'est : "x + 100" 00:02:12.535 --> 00:02:16.302 Passons maintenant à la bouche. Elle est dessinée à 250. 00:02:16.302 --> 00:02:22.993 C'est par là... c'est 250. Et 250, c'est 200 plus 50. 00:02:22.993 --> 00:02:29.635 Donc sa position est celle du visage PLUS 50. 00:02:29.635 --> 00:02:37.052 Bon... maintenant... Si je change la valeur de "x", cela bouge tout le visage ! 00:02:39.205 --> 00:02:42.697 Bon avant de terminer, on va voir d'autres utilisations des variables. 00:02:42.697 --> 00:02:45.558 Une fois que vous avez créé une variable avec "var x"... 00:02:45.558 --> 00:02:48.395 vous pouvez changer sa valeur tant que vous voulez. 00:02:48.395 --> 00:02:57.996 Donc, après avoir indiqué que x contient 198, je peux dire que x contient 300 ou... x contient 150. 00:02:57.996 --> 00:03:03.724 Pour l'ordinateur, x contiendra la dernière valeur qu'on lui a indiqué. 00:03:03.724 --> 00:03:05.529 Ici, c'est 150. 00:03:05.529 --> 00:03:08.235 Mais vous n'avez à écrire "var" qu'une seule fois. 00:03:08.235 --> 00:03:15.329 Si, ici, j'écris "var x=150;" j'indique que je veux une toute nouvelle variable appelée "x". 00:03:15.329 --> 00:03:21.062 Et du coup, cela détruit complètement la précédente variable "x". 00:03:21.062 --> 00:03:24.432 L'ordinateur utilisera ensuite la nouvelle variable "x". 00:03:24.432 --> 00:03:28.951 La plupart du temps, vous pourrez le faire sans problèmes... Mais vraiment, il faut éviter. 00:03:28.951 --> 00:03:32.448 Ici, je vais donc le faire qu'une fois. "var x=150;" 00:03:32.448 --> 00:03:39.058 Et je vais ranger Winston en dehors de l'écran... pour vous parler du point suivant... 00:03:39.058 --> 00:03:46.662 Dès que vous avez une variable égale à quelque chose on a la variable placée au bon endroit. 00:03:46.662 --> 00:03:53.269 En mettant la variable à gauche, on indique que l'on veut lui affecter une valeur. 00:03:53.269 --> 00:03:57.173 Placée à cet endroit, l'ordinateur va chercher à modifier sa valeur. 00:03:57.173 --> 00:04:00.037 Partout ailleurs, l'ordinateur va l'interpréter comme étant une "valeur". 00:04:00.037 --> 00:04:05.949 Même si on fait quelque chose comme "x contient 10" ("var x=10;") 00:04:05.949 --> 00:04:11.760 Puis... x contient x ( "x=x;" ) Wouhou... c'est bizarre ! 00:04:11.760 --> 00:04:19.997 Et bien, à gauche, on a notre VARIABLE qui peut avoir une valeur qui peut changer ! 00:04:19.997 --> 00:04:24.997 Mais à droite, on a... seulement 10 ! 00:04:24.997 --> 00:04:29.167 Avec ça, on peut faire des choses comme... 00:04:29.167 --> 00:04:33.535 J'écris... x contient "x+1". 00:04:33.535 --> 00:04:43.034 Donc à gauche, j'ai bien ma variable à sa place. et à droite, j'ai cette variable qui a une valeur... 00:04:43.034 --> 00:04:44.449 qui est simplement 10. 00:04:44.449 --> 00:04:47.199 Donc, on peut remplacer ça par : x contient 10 +1 00:04:47.199 --> 00:04:51.064 c'est à dire : x contient 11. 00:04:51.064 --> 00:04:57.453 Donc cette ligne veut juste indiquer "x contient 11" donc maintenant, on a "x" qui vaut 11. 00:04:57.453 --> 00:05:00.831 Voyons ce qu'il se passe si on utilise une autre variable. 00:05:00.831 --> 00:05:06.448 On écrit : "var x contient 10" 00:05:06.448 --> 00:05:10.500 et : "var y contient 20" 00:05:10.500 --> 00:05:12.733 puis : "x contient y" 00:05:12.733 --> 00:05:17.029 et : "y contient 7" 00:05:17.029 --> 00:05:21.203 OK. Et je veux savoir ce que vaut "x" à la fin ? 00:05:21.203 --> 00:05:23.531 Bon. Regardons ça de près. 00:05:23.531 --> 00:05:28.604 Bon. Ici, on crée une nouvelle variable "x" qui vaut 10. 00:05:28.604 --> 00:05:31.287 Donc la valeur de x est 10. 00:05:31.287 --> 00:05:35.536 Ici, on crée une nouvelle variable "y" qui vaut 20. 00:05:35.536 --> 00:05:39.165 Comme on n'a pas touché à "x", "x" vaut toujours 10. 00:05:39.165 --> 00:05:44.098 Maintenant, ici, on indique que "x contient y" ! Bon... qu'est-ce que ça fait ? 00:05:44.098 --> 00:05:47.869 On sait qu'il y a une variable du bon côté... 00:05:47.869 --> 00:05:52.204 et que de l'autre côté, on a une variable qui est interprétée comme une valeur. 00:05:52.957 --> 00:05:59.008 Donc on peut remplacer le "y" par sa valeur : c'est 20 ! 00:05:59.008 --> 00:06:04.725 Donc on a maintenant "x contient 20". Et la valeur de "x" est maintenant... 20. 00:06:04.725 --> 00:06:09.948 Maintenant, ici, on a "y" du bon côté... mais c'est plus simple car... 00:06:09.948 --> 00:06:12.698 ... de l'autre on a une valeur. 00:06:12.698 --> 00:06:21.071 J'ai une question, ici : quand je change la valeur de "y"... ici, est-ce que cela change la valeur de "x"... ici ? 00:06:21.071 --> 00:06:25.558 La réponse est... Non. Non, non, non et non. 00:06:25.558 --> 00:06:31.166 Souvenez-vous que... ici, "y" est seulement interprété comme un nombre. 00:06:31.166 --> 00:06:35.864 L'ordinateur va complètement ignorer que c'est une variable... 00:06:35.864 --> 00:06:41.614 et il va juste se dire : "oh ! y, vous vouliez dire 20". 00:06:41.614 --> 00:06:49.224 Donc, ici, on affecte à x seulement un nombre... pas une autre variable. Seulement la valeur 20. 00:06:49.224 --> 00:06:58.705 Et donc, à la fin, la valeur de "x" reste à 20. Même après avoir changer la valeur de "y". 00:06:59.635 --> 00:07:08.055 Hou ! Compris ? Et bien vous êtes experts sur les variables maintenant ! Bravo !!