Original subtitles

So after arrays,

it's now time to learn about

another data structure in JavaScript, which is objects.

So up until this point,

we have been using arrays as a data structure

to basically store multiple related values

in the same variable.

So let's just quickly recap that.

So Jonah's array,

and you don't need to write this code, okay?

I'm really just trying to recap here.

So we have the first name,

and you see that I'm writing this in multiple lines now.

And that is perfectly acceptable.

So, sometimes that's easier to give us

an overview of a data structure.

As long as we remember the commas here

after each of the elements, we're gonna be fine.

So then we have kind of this age calculation here.

Then we add the job,

and even an array of friends.

So we have an array inside an array.

So Michael, Peter, and Steven.

So again, this is basically a data structure

which combines multiple values

which all belong to this Jonas entity.

Now we know intuitively

that this first element here of the array

should be called the first name.

And this one is the last name.

This one could be called age,

this one could be called job,

and this one could be called the friends.

But in arrays,

there is no way of giving these elements a name.

And so we can't reference them by name,

but only by their order number

in which they appear in the array.

And so to solve that problem,

we have another data structure in JavaScript,

which is objects.

So in objects, we actually define key value pairs.

And so then we can give each of these values here, a name.

So let's see how.

So again, we're defining a variable.

And so I'm calling this one Jonas now,

and then this is the actual object.

So now instead of the square brackets

that we use for arrays,

we use the curly brackets or curly braces.

So this is the second time we're seeing the curly braces.

First, we saw them to define a code block,

for example, in an if else statement,

or if a switch statement,

or even to define a function body.

But this is different, okay?

So these curly braces here are to define a new object.

And so let's now fill up this object with key value pairs.

So the key is basically the variable name.

So let's say, first name,

then a colon,

and then the value.

And the value can be of any type that we want here.

Then to define another key value pair,

we just separate them with commas,

just like in the array.

So last name,

and then colon, remember,

Schmedtmann, then the age,

and once more, we can put any expression here.

So this will be calculated,

and then will be assigned to age.

Then the job,

which is teacher.

And finally,

the friends,

and let's just copy this array from here, okay?

And so with this we have now an object

which contains five key value pairs.

So again,

these are the five keys,

and then each key has a value.

And so essentially with this,

we were able to assign a name

to each of these values that we had.

So that's something that was impossible in arrays,

but now it is possible.

Now each of these keys is also called a property.

So we say that this object here,

so this object, which is called Jonas has five properties.

So property first name with the value of Jonas,

property last name with the value of Schmedtmann,

and so on and so forth.

Now, objects are probably the most fundamental concept

in the whole of JavaScript language.

So there are many ways of creating objects.

And simply writing an object in the code like this

is probably the simplest way of creating an object.

So here with the curly braces.

So there are multiple ways of creating objects.

But again, using the curly braces like this

is the easiest one,

and it's called the object literal Syntax

because we are literally writing down

the entire object content.

So to recap, just like arrays,

we use objects to essentially group together

different variables that really belong together

such as the properties of Jonas

that we've been working with.

Now, the big difference between objects and arrays,

is that in objects, the order of these values

does not matter at all when we want to retrieve them.

And that's important to keep in mind.

So in arrays,

the order in which we specify the elements matters a lot

because that's how we access these elements, right?

So we can only access array elements

using their order number.

This means that we should use arrays for more order data,

and objects for more unstructured data.

And data that we actually want to name,

and then retrieve from the object,

based on that name.

But how do we actually do that?

So how do we get data from an object?

And that's exactly what the next lecture is about.

So, see you there in a second.