Hi and welcome to this video about JavaScript arrays.
Arrays are an essential data structure in JavaScript.
They allow us to store and manipulate
multiple data types such as strings, numbers, booleans, and even objects.
An array is defined using square brackets and can contain any type of data.
You can mix text numbers and other data types within the same array.
So let's see an example.
I'm just going to clean up my editor and then I'm going to create hobbies array.
And this array will contain sports string, cooking string,
let's just give it a number as well.
You can contain a boolean value, so let's just give it true.
It can also contain any kind of objects, such as baking, for example.
And it can also contain an array within it like reading and traveling.
So if we just quickly run this and see the values of hobbies,
we're going to see that we get no error and all of the elements are in our array.
To loop through an array, we can use the for of loop.
It allows us to access each element
of the array one by one and perform operations on it.
For example, for let hobby of hobbies, console log hobby.
Great, let's run this.
And now we're going to see the individual items from an array outputted
here. You can also use hobby and in, for example.
And this way you're just going to grab
an index of the array and you can do this to achieve the same result.
Let's run this and we see that we have the same output.
JavaScript also provides a variety
of built in methods that we can use on arrays.
Some of the most commonly used methods
include map, which allows us to transform the values of an array, and Filter,
which allows us to select a subset of the array.
So let's experiment on this.
Let's create another hobbies array.
And here we're going to put sports cooking and painting.
Now let's create a subset such as hobbies subset.
And you can use a slice function to grab a subset of this array.
So let's say zero to two.
This way we're going to be grabbing zero
and one, and the two is going to be excluded from our subset.
So let's check this out.
I'm just going to comment out the console locks here.
Let's run this and that's it.
We see the first and second element from our hobbies array.
You can also do the filtering of the array if you'd like.
So let's create filtered hobbies.
And let's say that we want to get
everything from the hobbies array that is not equal to sports.
So if value is not equal to sports, we want to see the values in our array.
So let's see filtered hobbies.
Now let's run this and great.
Now we're getting cooking and painting because they're not equal to sports.
Map method returns a new array that is derived from the original array
by transforming each element.
It takes a function as an argument
that defines how to transform the element, and then it returns a new array.
We can use the arrow function within
the map method to add, remove, or modify elements of the array.
For example, let's update our hobbies array.
Let's create updated Hobbies,
and then let's loop through the Hobbies array with a map function.
Let's get the value of each element and then return hobby plus value.
Great. Now, if we were to see the updated
hobbies, we're going to see that we added a string to each of the values here.
In conclusion, arrays are crucial data structures in JavaScript.
By using built in methods like Map,
we can manipulate arrays and create new ones based on our needs.
For more information on arrays and other built in methods,
please see the description where I'm going to link the documentation to MDN website.
Thanks for watching and see you in the next video.