In this lecture, I want to talk about next, very helpful and flexible feature of ethics, I'm going
to demonstrate what spread operator is actually it's really nice and great tool and it makes our life
much more easier as JavaScript developers, as usual.
Usually I'm going to compare iOS five code to ethics.
Let's say we have two arrays, right.
Constant number one,
and insert here some numbers and then create second variable concept number two again with some numbers.
Then assume that we need to concatenate those arrays and make a new one for that.
In JavaScript, we have a built in method called Concat, which actually works with arrays and helps
us to make new array with concatenating two or more arrays.
So create another variable, let three.
Which equals two numbers, one dot concat and as an argument place, you number two, let's see what
we have, display number three array in Castle.
So we have a new era which consists of items from number one and number two arrays.
This is a good way.
It works nice, but sometimes it's not really convenient, especially when we want, for example, to
concatenate those arrays and between their items, insert a new one in order to achieve that.
Let's use a little trick, actually.
This is one of the ways.
But you can do it using different ways.
Let's delete those lines, create again new array and assigned to it empty.
Right.
Then at first concatenate these Aptera with numbers one array.
So right now, three equals two numbers, three dot concat and insert your numbers one.
Now let's see in Castle what we have right.
Castle dot log number three.
Reload and we have an array with items of numbers one.
Right, so now is the moment when I want to add new item, which there should be placed between number
one and number two.
Right items.
So use your push method and add new item.
Write numbers three that push.
And as an argument, let's place your time.
Reload and see that new item is added to number three.
Right, OK, now it's time to concatenate it with numbers to array for that.
Right.
Number three equals two.
Number three, dot concat and then write numbers to
reload.
And we have results that we wanted to get, but in order to achieve that, as you see it, we need to
write couple of lines of code in ethics.
This stuff became much more simpler because of the spread operator.
We can simply create a new variable, let's call it numbers for.
Then open square brackets and now it's time to use spread operator for that, we just need to write
three dots and then name of the error rate actually spread operator takes out items from array, but
because of that, we have passed it into square brackets.
Finally, we will get a new array.
OK, in the same way, let's place your second array.
Right, dot, dot, dot, number two.
Let's run numbers for in council duplicated and change.
So we have here new array, which consists of items from number one and number two arrays.
So using Sprite operator in a very simple way, we have concatenated number one and number two arrays.
And in order to add the new items anywhere we want, I mean, between array items at the beginning or
at the end of the array, we just need simply to.
Right, for example, turn that between arrays.
Right.
20 and then to the end.
Right, 30.
Reload and you see that items are added on the other places, so as you see, it's clear how helpful
and useful spread operator is because to achieve the same result, we just needed to write only one
line of code.
All right.
This was the case of concatenating the arrows, but using spread operator, we can even copy the arrays.
Let's try to do it using S5 and create new array.
Which will consist of names, right?
Jane, then Bob.
Alex, and right here at.
So we want to copy Disarray, and for that, let's create another variable and assign to it names.
All right, let's call it names copy, which equals the names.
Let's log both variables in Castle, right, castle dot log names and then Castle dot log names.
Copy.
So you see that we have to arrays with exact same values, but if we use push method and add new item
to name Sarah, for example, John, that it will be added to both a race.
It doesn't matter if we add item to name Sarah or names copywrite.
In both cases, we will have the same results.
Actually, this stuff is already known for you from JavaScript behind the scenes section where we have
talked about primitives versus objects.
Because of that, arrays are objects, names.
Copy Variable became just a reference of names right in memory space.
But actually we don't need it.
We need to copy the array and create new memory space for it.
So in order to avoid update on both of them in S5, we can do it in the following way.
Let's make here some changes.
We need to concatenate an empty array with names array.
So remote and you see that in this case, after using push method, the new item is added to names are
only and not two names.
All right.
As I see it, like it was in previous case, in order to achieve needed results, we have to use some
tweaks and hacks in S5.
But in Essex, again, we can do it very simply.
We just need to use spread operator.
So right here.
Dot, dot, dot names, as I see it's surrounded by square brackets.
So Spread Operator will iterate over the names array and that will share its items to new array reload
and we have the same output.
Again, you can see how convenient is to use a spread operator.
It makes code more concise and also more understandable.
Before we finish, I want to show you one more use case of spread operator.
And for that I'm going to create a function, let's call it some.
This function will take three parameters X, Y and Z.
And then in cancel that run the sum of these parameters.
Right, X plus Y plus that.
Now, let's assume we want to insert as an argument.
All right, so let's create a new variable numbers.
And insert here 10, 20 and 30, and in order to use this array as an argument in year five, we have
to use apply method as remember this method calls function, but as an argument it takes away.
This is the only difference between call and apply methods.
So.
Right.
Some don't apply because of that.
We are not interested in about this variable.
Let's just place here now as the first argument and then as a second one, insert numbers.
Reload and we have 60 the some of the numbers, again, using spread operator, we can achieve this
result in very simple way.
We don't need to use apply method.
We have to write just dot, dot, dot numbers.
In this case, we don't need to use square brackets here because we just need to take out numbers from
array and not to create new array.
So reload.
And we have 60 again.
All right.
So this is the way House Press operator works.
You agree that it's very helpful and powerful feature of ethics.
OK, let's go ahead.