All language subtitles for 6- Arrays

Sometimes in your

applications, you might be dealing with a list of objects. For example,

the list of products in a shopping cart, or the

list of colors the user has selected, in situations like that,

you use an array to store that list. Let me show you how.

So here I'm going to declare another variable called

selected colors. Note that I'm using a meaningful

name, I don't have sc or some other weird name.

Selected colors. Now we can initialize this, and set

it to an empty array. So these square brackets

are what we call array literal, and they indicate an

empty array. Now we can initialize this array and add

a couple of items, like

red and blue. Let's log this on the console, so

console.log selected colors. Save the changes

so here's our array with two elements.

We can expand that, note that each element has an index,

and that determines that position of the element in that array. So,

the index of the first element is 0, and the index of the second

element is one. So if you want to access an element in the

array, we use this index. Here's how. For example, let's say

you want to display the first element in this array, we use these square

brackets, and then specify the index.

Save the changes, and now we have red. Now earlier, I told

you that JavaScript is a dynamic language. So the type of

variables can change at run time. The same principle applies

to our arrays. So the length of arrays as well as the type

of objects we have in an array are dynamic, they can change.

So, on line 2, we initialize this array with 2

elements, right? Now, on line 3 we can add

another element to this array, so the array will expand.

So, let's say selectedColorsof 2, that means

the third item in this array will also be green.

Now, let's display this array on

the console, so, we have an array with 3,

elements. So the length is dynamic, it can change, also

the type of objects we have in this array is dynamic,

so unlike other programming languages, where every item or

every 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. Save the changes, now we have

2 strings and a number. So the objects in the array as well as

the size of the array are dynamic. Now technically an array

is an object, so just like the person object we defined in the last lecture

it has a bunch of key value pairs, or properties that we can

access using the dot notation. Let me prove that to you. So here

on the console, let's look at the type of selected

Colors. So the type of this array is an

object. So an array is an object in JavaScript. So here on line

4, we can look at the properties of this array, or this

object, using the dot notation, look these are

all the properties defined in arrays in JavaScript, so,

every time we declare an array using square brackets, that array

will automatically receive these properties, we didn't explicitly

define them, they are just somehow magically inherited

from somewhere else. We're going to learn about that later when we talk about

prototypes. Now in this lecture, we're going to look at one of these properties.

That is the length property. This property returns

a number of items or elements in an array. So,

save the changes, you can see we have three elements in this array.

Now later in the course, we have a comprehensive section about arrays, you will

learn about all kinds of operations you can perform on arrays,

for now, all I want you to take away, is array, is a

data structure, that we use to represent a list of items.