[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:01.06,0:00:04.07,Default,,0000,0000,0000,,Let's keep exploring \Nwhat we can do with objects. Dialogue: 0,0:00:04.07,0:00:07.78,Default,,0000,0000,0000,,We're back with the program \Nthat we used in the functions tutorial. Dialogue: 0,0:00:08.34,0:00:11.84,Default,,0000,0000,0000,,This program has this drawWinston \Nfunction which knows how to draw Dialogue: 0,0:00:11.84,0:00:14.18,Default,,0000,0000,0000,,Winston at a certain X and Y. Dialogue: 0,0:00:14.68,0:00:18.13,Default,,0000,0000,0000,,And then down here, \Nwe call drawWinston four times, Dialogue: 0,0:00:18.13,0:00:21.04,Default,,0000,0000,0000,,each with a different set \Nof X and Y coordinates. Dialogue: 0,0:00:21.50,0:00:25.71,Default,,0000,0000,0000,,Well, you know me, when I look \Nat those four drawWinston calls Dialogue: 0,0:00:25.91,0:00:30.43,Default,,0000,0000,0000,,that are so similar looking,\Nall I can think about is how much better Dialogue: 0,0:00:30.43,0:00:35.80,Default,,0000,0000,0000,,it would be if we could use a loop \Nand just call it one time inside the loop Dialogue: 0,0:00:35.80,0:00:39.17,Default,,0000,0000,0000,,changing the X and Y \Nin each iteration of the loop. Dialogue: 0,0:00:39.86,0:00:44.36,Default,,0000,0000,0000,,So, to do that, we need to find \Na way to store these X and Y positions Dialogue: 0,0:00:44.36,0:00:47.67,Default,,0000,0000,0000,,in an array so we can loop through it. Dialogue: 0,0:00:47.67,0:00:51.93,Default,,0000,0000,0000,,Well, we have two sets of values,\Nso what we could do is have two arrays, Dialogue: 0,0:00:51.93,0:00:56.03,Default,,0000,0000,0000,,one for X positions\Nand one for Y positions. Dialogue: 0,0:00:56.03,0:01:01.26,Default,,0000,0000,0000,,So, X positions we might have 99, \N294, 101, and 294, Dialogue: 0,0:01:02.28,0:01:08.81,Default,,0000,0000,0000,,and Y positions \Nwe'll have 117, 117, 316, 316. Dialogue: 0,0:01:09.56,0:01:14.47,Default,,0000,0000,0000,,Okay, and now we can loop through \Nthose with our for-loop var i = 0; Dialogue: 0,0:01:14.47,0:01:18.67,Default,,0000,0000,0000,,i < xPositions.length; i++ Dialogue: 0,0:01:19.03,0:01:22.30,Default,,0000,0000,0000,,So we're going through each element \Nin xPositions and we'll say Dialogue: 0,0:01:22.30,0:01:29.38,Default,,0000,0000,0000,,drawWinston(xPositions[i], \NyPositions[i]); Dialogue: 0,0:01:30.31,0:01:34.94,Default,,0000,0000,0000,,Okay, so, let's see \Nif that works by deleting... Dialogue: 0,0:01:34.94,0:01:36.44,Default,,0000,0000,0000,,Alright, that worked. Dialogue: 0,0:01:36.44,0:01:40.28,Default,,0000,0000,0000,,So now we can actually just call this, \Nwe just have this one line of code Dialogue: 0,0:01:40.28,0:01:43.97,Default,,0000,0000,0000,,that does drawWinston, \Nbut it does it for every position Dialogue: 0,0:01:43.97,0:01:45.42,Default,,0000,0000,0000,,in the xPositions array. Dialogue: 0,0:01:45.55,0:01:49.06,Default,,0000,0000,0000,,So, we can go and add more to this \Nand by saying like... 10, Dialogue: 0,0:01:49.06,0:01:57.24,Default,,0000,0000,0000,,then we add 1, and then 1, \Nand then 1, and then 100, and 1. Dialogue: 0,0:01:58.57,0:02:03.11,Default,,0000,0000,0000,,Now, now it's getting to look\Na little bit messy and I don't like it Dialogue: 0,0:02:03.11,0:02:08.23,Default,,0000,0000,0000,,because it's really hard for me to see \Nwhich Xs relate to which Ys. Dialogue: 0,0:02:08.44,0:02:14.96,Default,,0000,0000,0000,,I want to be able to look at a glance \Nand know what my X and Y pairs are, Dialogue: 0,0:02:14.96,0:02:18.49,Default,,0000,0000,0000,,instead of having to make sure \Nthat I perfectly align them up Dialogue: 0,0:02:18.49,0:02:20.76,Default,,0000,0000,0000,,above each other, like this maybe. Dialogue: 0,0:02:22.53,0:02:26.98,Default,,0000,0000,0000,,So, I want to find a different way \Nof storing these positions. Dialogue: 0,0:02:26.98,0:02:30.76,Default,,0000,0000,0000,,One idea is that we could \Nactually store them as objects. Dialogue: 0,0:02:31.00,0:02:35.08,Default,,0000,0000,0000,,Think about it, each position is \Nreally two bits of information: Dialogue: 0,0:02:35.08,0:02:39.39,Default,,0000,0000,0000,,the X and the Y. So, we could have \Nan object which has X and Y properties, Dialogue: 0,0:02:39.39,0:02:43.39,Default,,0000,0000,0000,,and then we could have an array \Nof objects with all these X Dialogue: 0,0:02:43.39,0:02:45.64,Default,,0000,0000,0000,,and Y positions.\NSo, let's do that. Dialogue: 0,0:02:46.26,0:02:51.13,Default,,0000,0000,0000,,We'll say var positions equals an array. Dialogue: 0,0:02:51.13,0:02:56.11,Default,,0000,0000,0000,,But, each element, instead of being \Na number, is going to be an object. Dialogue: 0,0:02:56.36,0:03:00.33,Default,,0000,0000,0000,,So, here we have our curly brackets \Nand then we're just going to say Dialogue: 0,0:03:00.33,0:03:04.71,Default,,0000,0000,0000,,X: 99, Y: 117. Dialogue: 0,0:03:05.56,0:03:08.92,Default,,0000,0000,0000,,Okay, so now we have one \Nof our positions in here, Dialogue: 0,0:03:08.92,0:03:13.11,Default,,0000,0000,0000,,and then we'll go add another one here. Dialogue: 0,0:03:14.36,0:03:21.18,Default,,0000,0000,0000,,Alright, X should be 294, 117, \Nthe third one is going to be 101, Dialogue: 0,0:03:22.98,0:03:30.35,Default,,0000,0000,0000,,316, and the final one is 294 and 316. Dialogue: 0,0:03:31.67,0:03:36.10,Default,,0000,0000,0000,,Okay, so now we have an array \Nof objects where each object has Dialogue: 0,0:03:36.10,0:03:38.08,Default,,0000,0000,0000,,X and Y properties in it. Dialogue: 0,0:03:39.24,0:03:42.55,Default,,0000,0000,0000,,So down here, in our for loop \Nwe'll just change this to iterate Dialogue: 0,0:03:42.55,0:03:48.31,Default,,0000,0000,0000,,through {\i1}positions.length{\i0}.\NThen we'll pass in the object. Dialogue: 0,0:03:48.47,0:03:52.82,Default,,0000,0000,0000,,Now, right now it's passing \Nthe entire object, but we want to pass Dialogue: 0,0:03:52.82,0:03:58.77,Default,,0000,0000,0000,,the X and the Y, so we need\N{\i1}positions[i].x{\i0} and {\i1}positions[i].y{\i0}. Dialogue: 0,0:03:59.20,0:04:00.69,Default,,0000,0000,0000,,Tada! Dialogue: 0,0:04:00.69,0:04:03.84,Default,,0000,0000,0000,,Now, we can get rid \Nof these old, clustered arrays. Dialogue: 0,0:04:04.56,0:04:09.58,Default,,0000,0000,0000,,Great, so this looks a lot nicer to me \Nand makes the code much more readable, Dialogue: 0,0:04:09.71,0:04:12.62,Default,,0000,0000,0000,,and any time we can have \Nmore readable code, it's better. Dialogue: 0,0:04:13.18,0:04:16.33,Default,,0000,0000,0000,,It also makes it easier to add, \Nso if I want to add one, Dialogue: 0,0:04:16.33,0:04:23.54,Default,,0000,0000,0000,,I'll actually just add the pair together, \Nand then we can say X is 200, Y, 200, Dialogue: 0,0:04:23.58,0:04:25.71,Default,,0000,0000,0000,,get a little Winston in the middle there. Dialogue: 0,0:04:26.54,0:04:27.60,Default,,0000,0000,0000,,Cool. Dialogue: 0,0:04:27.93,0:04:30.98,Default,,0000,0000,0000,,Now I want to show you something \Neven fancier than this. Dialogue: 0,0:04:31.81,0:04:36.36,Default,,0000,0000,0000,,Notice how our function right now \Naccepts two numbers Dialogue: 0,0:04:36.36,0:04:39.15,Default,,0000,0000,0000,,and then uses those two numbers. Dialogue: 0,0:04:39.15,0:04:42.29,Default,,0000,0000,0000,,Well, we could change our function \Nso that it expects an object Dialogue: 0,0:04:42.29,0:04:45.26,Default,,0000,0000,0000,,and then it gets the X \Nand Y from that object, Dialogue: 0,0:04:45.26,0:04:49.06,Default,,0000,0000,0000,,meaning that down here \Nwe could just pass the object. Dialogue: 0,0:04:50.02,0:04:51.50,Default,,0000,0000,0000,,Let's try that. Dialogue: 0,0:04:51.50,0:04:54.07,Default,,0000,0000,0000,,We pass the object, now it's broken. Dialogue: 0,0:04:54.07,0:04:57.68,Default,,0000,0000,0000,,That's because our function \Nstill is expecting two objects Dialogue: 0,0:04:57.68,0:05:00.27,Default,,0000,0000,0000,,and it's only getting one, \Nso we'll change it Dialogue: 0,0:05:00.27,0:05:05.07,Default,,0000,0000,0000,,to say it's getting facePosition, \Nand now we get an error Dialogue: 0,0:05:05.07,0:05:09.65,Default,,0000,0000,0000,,that faceX is not defined \Nbecause before we were passing in faceX Dialogue: 0,0:05:09.65,0:05:13.07,Default,,0000,0000,0000,,as an argument but now it doesn't exist, \Nwe're only getting an object. Dialogue: 0,0:05:13.07,0:05:19.01,Default,,0000,0000,0000,,So, what we could do, is save \Nthe X position from the object Dialogue: 0,0:05:19.01,0:05:21.26,Default,,0000,0000,0000,,inside the faceX variable. Dialogue: 0,0:05:21.26,0:05:24.95,Default,,0000,0000,0000,,So we're saying that we got this object, \Nwe know this object has an X property, Dialogue: 0,0:05:24.95,0:05:28.46,Default,,0000,0000,0000,,so we're just going to store \Nthat into the faceX variable. Dialogue: 0,0:05:28.46,0:05:33.76,Default,,0000,0000,0000,,We can do the same thing \Nwith Y, so faceY = facePosition.y. Dialogue: 0,0:05:33.76,0:05:35.07,Default,,0000,0000,0000,,Tada! Dialogue: 0,0:05:35.07,0:05:38.54,Default,,0000,0000,0000,,And then, you know, the rest \Nof the function uses faceX and faceY. Dialogue: 0,0:05:38.54,0:05:40.33,Default,,0000,0000,0000,,Now, we have to make sure \Nthat we spell them correctly, Dialogue: 0,0:05:40.33,0:05:44.15,Default,,0000,0000,0000,,if we did xx, it's not going to work \Nbecause that's not what it is down here Dialogue: 0,0:05:44.15,0:05:47.76,Default,,0000,0000,0000,,in our array of objects, \Nso it needs to match. Dialogue: 0,0:05:49.11,0:05:52.22,Default,,0000,0000,0000,,This is pretty neat because now you can \Nhave arrays of objects, Dialogue: 0,0:05:52.22,0:05:54.42,Default,,0000,0000,0000,,you can have functions \Nthat take in objects Dialogue: 0,0:05:54.54,0:05:59.09,Default,,0000,0000,0000,,and you'll really find that your programs \Ncan be very powerful with the way Dialogue: 0,0:05:59.09,0:06:00.78,Default,,0000,0000,0000,,that they structure their data Dialogue: 0,0:06:00.78,0:06:04.19,Default,,0000,0000,0000,,especially since it's so often \Nto want to pair X and Y together, Dialogue: 0,0:06:04.19,0:06:05.46,Default,,0000,0000,0000,,I think you'll find them Dialogue: 0,0:06:05.46,0:06:09.09,Default,,0000,0000,0000,,especially useful in all your drawing \Nand animation programs here. Dialogue: 0,0:06:09.09,0:06:10.99,Default,,0000,0000,0000,,So, go to it and have fun!