JavaScript Data Video Lecture Transcript This transcript was automatically generated by Zoom, so there may be discrepancies between the video and the text. 11:22:52 Hi! Everybody! Welcome back in this video. We are going to talk about the different types of data that you can have in Javascript this is going to be another example of a video that's really more of a reference point for you than a lecture. 11:23:05 But we will go through all the slides and see the example code. 11:23:11 So in Javascript. You know it. Remember, in programming languages, we tend to store our data and variables, different sorts. 11:23:21 So variables in general have to be declared in Javascript, meaning, you have to say, provide a keyword like they're let or const that. 11:23:29 Let's Javacript. No, this is going to be a variable, so we'll have this example. 11:23:35 There, underscore let underscore cons to HTML, for examples, and we'll reference back as we go through these slides. 11:23:43 So variables that are defined was there, which was, I believe, the original way. 11:23:47 You declared a variable, and Javascript. 11:23:49 These are global variables, meaning, they exist within the entire scope of wherever they're declared, meaning unless they're defined within a function. 11:23:58 So, if you have a variable that's defined within a function, you can only reference it within that function. 11:24:03 If you have a variable that's to client, define just in the regular script shell, it's defined globally and can be referenced in a function anytime. 11:24:11 You'd like variables that are declared with their can be redeclared and updated, meaning that you could run something like their acc equals 2, and then there x equals 4, and you would be fine or you could just update it. So you do Ver. 11:24:26 X equals 2, and then follow it with x equals 4. And now x would be equal to 4. 11:24:31 So let's dive into this code. 11:24:35 And here we go. 11:24:40 So in these first 2 examples, here we see we have an X there. 11:24:44 I'm declaring it with a there and then redecling it down here, and so if I ran console dot log X. 11:24:52 There, followed by console, dot log X. There, followed by console, dot, log tax, fair. 11:25:03 And now, if I go, and I open it in the. 11:25:09 In the web browser, and then we have to open up our developer tools. 11:25:20 Hey? We can see 2, 4, 2, and so that makes sense because we first defined it as a 2. 11:25:26 Then we declared it as 4, and then we updated it to be back to 2. 11:25:33 Another way, which is the now recommended way you define a variable in Javascript. 11:25:37 This is the recommended way, as you use the keyword, let, so let's our scoped within a single chun of code. 11:25:46 So meaning, if you are defined, of the variable within a function, it would be scoped within there, or if you define it within the shell script or not, the shell script, but the script element it would be within there in general code chunks within 11:25:58 Javascript are denoted with brackets, so remember our if else, or our functions, or our four- loops, you cannot to redeclare variables. 11:26:09 So if you tried running, let X equals 2, then let X equals 4, you'd get an error. 11:26:14 But you can update variables that are declared with a let. 11:26:19 So let's go back to our code. So here is an example where I'm declaring with a let and then updating. 11:26:26 And so I could do console dot log X let and then let's comment these out. 11:26:35 And then, followed by console dot log X lets. 11:26:40 So this will work just fine. Okay, so 2, 4. But now, if I uncommon the example where I'm redecling, we can see where this encounters an error. 11:26:52 So I'm gonna try and run this as is, and you'll see that now I get this syntax error saying that we're not allowed to read Clare a variable that was originally declared using the let keyword so if we go ahead and comment that out. 11:27:08 Then the code runs just like it did before. Okay, so the last way that you can declare a variable is with the const or constant keyword. 11:27:20 So these are again scope within a single code. Chunk. 11:27:24 And the reason. The difference between this and let is constants cannot be redeclared and cannot be updated. 11:27:30 So here are some examples where I'm defining my constant. 11:27:34 And then here's where I'm going to try and redeclare it. 11:27:38 And you see you're not allowed to redeclare a constant. 11:27:44 And then here's an example where I try and update it. 11:27:48 And we can see that I'm not allowed to update a constant. 11:27:51 So this makes sense, you're declaring it with this keyword const, which stands for constant meaning, that we shouldn't be able to change it later in the code if we want it to be a constant. 11:28:03 Okay, so those are the ways that you can declare. 11:28:05 Variables. Let's talk about some briefly, about a few data structures, mainly data structures that combine other data structures. 11:28:13 So you know, we have things like floats and integers and strings within Javascript. 11:28:18 But I'm going to focus in on arrays. Objects in Json. 11:28:22 So an array is a collection of objects in a sequential order, so these are analogous to Python's list. 11:28:31 As an example this array with square brackets, 1, 2, 3, 4, 5, is an example of an array in Javascript, just like with python indexing starts at 0. 11:28:40 So 1, 2, 3, 4, 5 square brackets at 2 would give us the number 3 unlike python, though we do not have negative indices, so we couldn't do something like this list at negative one and get 5 back. 11:28:54 There's also something known as an object. These are denoted with curly brackets similar to a python dictionary, but the properties so we don't, instead of keys, we have properties, and these are not stored as strings. 11:29:09 So here's an example where I have an object where I have the properties. 11:29:12 Type, color and shape, and then these properties have the values object red and triangle. 11:29:20 Okay, so values are accessed like a variable name. Dot property name. 11:29:26 So if I wanted to get the type of this object, I would do object. 11:29:30 One dot type. So let's go ahead and open up this example before we finish off with Json. 11:29:39 So here is an example with my array, and then I'm showing you that it is an array. 11:29:46 There's this function array is array which tells you if something's an array. And then, on top of that I show an example of indexing, followed by, let me be. What I'll do is I'll comment the rest of this out for now. 11:30:00 And then we'll come back and uncomment it after we won't run just the array part. 11:30:11 Okay, so let's go back. 11:30:14 So now we can see this true is the output of array. 11:30:18 Dot is array, and then this is the array at the 0 entry. 11:30:23 Okay. So now we've got objects. 11:30:30 And give me. Let's comment out this stuff. 11:30:38 So I've got an object here that has the type, color, and shape just like in the example in the slides. 11:30:45 And here I'm showing you how to access with object. 11:30:47 Name dot property name on top of having an object. You can combine objects in an arrays in a number of ways, so you can have an object whose values are arrays, or you can have an array whose entries are objects in this latter form the one that has an array whose values 11:31:08 are objects is gonna be what we see a lot of when we're working with D 3 dot, J. 11:31:14 S, okay, so let's go to. Well, maybe let's show what this you know. 11:31:21 Here, you can kind of see like this is the output that you would get so it's showing that it's an object. 11:31:28 This is accessing the type in the color. And then here, showing just different ways of accessing the 2 object, combined with arrays that we have okay. 11:31:40 So after objects we also have something called Javascript object. 11:31:44 You know notation. So this is distinct from a Javascript object in the way that you can tell that it's distinct is that the properties or keys here are Strings. 11:31:56 So in Json, this is between identical to a Java or Python dictionary, where you have these keys that are strings followed by these values, which could be any data type. 11:32:08 And then these are indexed exactly like a python dictionary. 11:32:11 So if you wanted to get the value of age within this, you access it like square brackets, key value, and that returns what you'd like. 11:32:20 And so if we go back to the code, we can see the examples. 11:32:25 Here's my json, and then I am outputting the age. 11:32:31 Let's also take a moment to point out that in Javascript, true and false, are stored in lowercase letters, all lowercase, unlike Python, were the first layer is upper case. 11:32:43 Okay, all right. So now, you have an idea of some of the fundamental data structures within. 11:32:49 Json, or within Javascript, and then also how to declare a variable which will be useful when we start writing D. 11:32:57 3 dot Js code in these coming notebooks I hope you enjoyed learning about these data structures, and I hope to see you next time.