2.6 Arrays

Hello everyone and welcome to this course or we're going to look at arrays in JavaScript. Sometimes, in your applications, you may be dealing with a list of objects, for example the list of products in a shopping cart or the list of colors that the user has selected. In situations like this you have an array to store this list. Here I'll declare another variable called "selectionColor", note that I use a meaningful name in camelCase. And now we're going to initialize it and set it to an empty array. So these brackets are what we call a literal array; it indicates an empty array. Now this array and add some elements like red and blue. We save and make a console.log of "selectionColor". And here is our array with these two elements "red" and "blue". We can further expand each element to an index and that determines this position of the element in this array. So the index of the first element is 0, the index of the second element is 1. So if you want to access an element of the array, we use this index. For example, suppose you want to display the first element of this array we use these brackets and then we specify the index. Now we have the red on the console. Earlier I told you that JavaScript is a dynamic language. So the type of variable can change at runtime. The same principle applies to our arrays. The length of the arrays as well as the type of objects we have in an array are dynamic, they can change. At line 2, we initialize this array with two elements. Now on line 3, we can add another element to this array so that this array expands so we'll put in selectionColor[2] with an index between brackets 2, so this means that the third element of this array will be green. Now let's display this array on the console. We have an array with three elements as we said we can see that the length is dynamic and can change the type of objects we have in this array is also dynamic unlike other programming languages where each element or each object in the array should have the same type. In JavaScript we can store different types in an array, so we can make the last element a number. One now gets 2 strings and a number. The objects in the array as well as the size of the array are therefore dynamic. Now technically an array is an object so just like the person object we defined in the last video, there are a bunch of key pairs or properties that we can access using dot notation. So here on the console, Let's look at the selected color type, so we do a typeof selectionColor and we see that the type of this array is an object. An array is therefore an object in JavaScript, here on line 4 we can look at the properties of this array or this object. Using dot notation, here are the properties defined in the JavaScript arrays. Whenever we declare an array using square brackets, the array will automatically get its properties. We did not define them explicitly, they are inherited in some other way. We will learn about them later when we talk about prototypes. We will look at one of them and its properties, it's the "lenght" property, it returns a number of items or elements in an array so you can see that we have three elements in this array. Later in the course, we have a whole section on arrays. You'll learn about all sorts of operations you can perform on arrays. That's it for this video we'll see you again for a new video on Functions in JavaScript.