Hi and welcome to this video course on JavaScript.
I'll be discussing two important operators
that you should be aware of that are the rest and spread operators.
The spread operator is one we'll use quite a bit.
Let's say we want to add a hobby to an array without editing the original array.
We want to create a new array with old values and create new array from it.
This is a common pattern called immutability where we never edit existing
values but always replace them with the copies and maybe plus changes.
To copy an array, we can use slice operator or create a new
array with square brackets and add the elements.
However, this will result in a nested array and not a copy.
To overcome this, we can use the spread operator represented by three dots.
The spread operator pulls out all of the elements from the array or object
and adds them one by one to the new array or an object.
For example,
let's create hobbies array and let's give sports and cooking to this array.
And now let's recreate this array and create a copied hobbies array.
We need to use spread operator for this represented by three dots.
Now if we were to console log copied
hobbies array, we're going to see sports and cooking appear there.
You can also copy an object using spread operator.
For example, let's create a person object
and let's give this person a name and it will be Nata.
And let's give this person an age and it will be 26.
In order to copy this object, all you have to do is use the spread operator again.
So let's create copied person
and let's use the spread operator and put person here.
And now let's do copied person.
Let's see and we see the same object appear here.
You can also do something like this where you add some values to this object.
Let's say we want to add a hobby traveling.
Now if we output this, we're going to see hobby here as well.
You can do the same with the race and let's add some values to these hobbies
such as traveling for example whoops, I misspelled this.
Great, let's save this.
And now we're going to see traveling appear here as well.
Okay, now let's discuss the rest operator
which is the opposite of the spread operator.
It merges multiple arguments into an array.
The rest operator is represented by three dots as well
just like the spread operator.
The difference lies in the place where you use it.
If you use it in the argument list of a function, it's the rest operator.
For example, let's do something like this.
Let's create two array function.
Let's create the arguments with the rest
operator and let's make it return the argument.
Now if we console log two array one, two, three for example as our
arguments, if we run this, we're going to see that it's an array.
In conclusion,
the spread operator and the rest operator are two important operators.
In modern JavaScript,
the spread operator is used to pull out elements from an array or an object,
while the rest operator is used to merge multiple arguments into an array.
Thanks for watchman and see you in the next video.