Instructor: Before moving on from the topic of objects
to the topic of functions
I just want to very quickly compare primitives and objects.
We actually talked about this very briefly
at the beginning of this section,
but then we were too busy talking about the prototype chain
and those important things.
But let's get back to it now.
So let's get first rid of this code here.
All right.
So, primitives versus objects,
and we basically know that only numbers,
strings, booleans, undefined, and null
are primitives and that everything else are objects.
Now we already know a lot of differences between the two,
so let's now compare them even more.
So a big difference between primitives and objects
is that variables containing primitives
actually hold that data inside of the variable itself.
On objects it's very different.
Variables associated with objects
do not actually contain the object,
but instead they contain a reference to the place in memory
where the object sits, so where the object is stored.
So again a variable declared as an object
does not have a real copy of the object
it just points to that object.
So let's see this in practice.
And I'm going to start with primitives.
So let's define a couple of variables.
So let's simply call it A and set it to a random number
and then let's create variable B
and say it should be equal to A, okay.
So B is now also 23, right.
And now I'm going to mutate A,
which means to change it value
and I'll change it to 46,
and that's now simply console log A and B.
A
and B.
So 46 and 23, that's what you expected, right.
So A is 46,
because we changed it from 23 to 46 here in this line
and B is 23,
because up here we said that B should be equal to A, right.
So what we did here
was to simply copy the value of A to B,
and when we then changed A to 46
this did not affect the value of variable B,
which still is 23.
And this means that each of the variables actually hold
their own copy of the data.
They do not reference anything.
So two variables holding primitives
are really two different things.
So let's do something similar with objects this time.
So obj one.
So this is our first object
name John and then just set the age to 26, okay.
And now something very similar,
I just say object two
equals object one, okay.
Such as we did before with B equals A.
And now I'm going to mutate the age on object one.
So the age, and I'm going to change it to 30.
And then let's console log the age on object one
and duplicate this line in object two.
All right.
So we have a small bug here, all right.
So because this would be object one of course, right.
So what happens now?
Okay, they are both 30,
so object1.age and object2.age
are both 30 and that's really strange, right.
Well not really actually
and that's because when we said object one
should be equal to object two
we did not actually create a new object.
No copy was created here,
all that we did was to create a new reference
which points to the first object,
so the object one and object two variables
both hold a reference
that point to the exact same object in the memory,
and that's why when we change the age in object one
this change is also reflected on object two,
because in fact it's the exact same object.
So this is some really interesting stuff, right.
It took me some time to actually understand this.
Now with functions it works in the exact same way.
So let's see what happens when we pass a primitive
and an object into a function.
So let's create some space here.
Objects, these were the primitives,
and now functions.
So I'll start by creating an age variable.
Okay, and then another object,
and this time it's not going to be John.
This time it's me, so, Jonas.
And I will say the city, and that's Lisbon.
So the city where I'm currently located.
And now we write a simple function,
which I'm just going to call change
and it receives two parameters, A and B.
And all this does is to mutate the data.
So you want A to be 30
and we want B.city
to be San Francisco, for example,
because it's a really nice city, you know.
So now we're going to call this function
and as you can guess
we are going to pass age as the A variable,
so as the A argument
and the object as the B argument.
Okay.
And now once again we will simple console that log
the result to the console.
So the age and then console that log
obj.city.
So what do you expect is going to happen now?
And let's see.
Okay, so 27 is age and this object city,
so the city attached to object variable is San Francisco.
So we have the same thing here.
We pass the age variable holding a primitive
and the object variable holding a reference to an object
into our function.
This function then as it was invoked
attempted to change the arguments that we passed into it.
So when we then console log the values
we see the same thing as before,
and that is that the primitive has remained unchanged,
but the city and the object
has changed from Lisbon to San Francisco
with this line of code here, right.
So this shows us
that when we pass a primitive into the function
a simple copy is created,
so we can change A as much as we want,
it will never affect the variable on the outside
because it is a primitive.
But when we pass the object
it's not really the object that we pass,
but the reference to the object, okay.
So again we do not pass an object into a function,
but only the reference that points to the object.
So when we then change the object inside of the function
it is still reflected outside of the function.
So I hope that this shows you
that it's really something very important
that we should really be careful about, right,
because this can lead to some unexpected results
and some strange bugs.
And that's why it's super important
that we have this information now.
Cool, so let's now go to the next lecture right now.