Map allows you to iterate over items within an array, and perform a function on each item. It then returns a new array, which includes the result of that function on each item.
Here is a small example:
// this is the original array const array = [1, 2, 3, 4, 5]; // here we are adding 3 to each number in the array const newArray = array.map(number => number + 3); // this is us console logging the new array console.log(newArray); // the new array will be [4, 5, 6, 7, 8]
As you can see in the above, we iterate over each number in the array, perform the function (in this instance we add 3 to each number), and a new array is returned containing the new numbers.
Push() is a simple method, but it's very useful, and comes in handy almost every day! The official definition of Push() can be found here, but I think I'll be able to explain it quite well.
Push() does two things; it adds zero or more items to the end of an array, and it also returns the length of the amended array.
// this is our original array const shoppingList = ['Bread', 'Milk', 'Chocolate']; // using the push method returns the length of the array const newShoppingListLength = shoppingList.push('Crisps'); // this is us console logging the count of the amended array console.log(newShoppingListLength); // the above will log: 4 // this is us console logging the amended array console.log(shoppingList); // the above will log: ['Bread', 'Milk', 'Chocolate', 'Crisps];
This method comes in handy when counting up things, such as a shopping list, or users, or anything else that you might add to a list. It allows you to add an item to the end of the list, and also allows you to quickly find the length of that list.
Filter() is another really useful method. Filter() allows you to do a check on every item in an array, and then return a new array containing all of the items that passed that check.
// here is our original array const colours = ['dark red', 'light blue', 'pink', 'light red', 'red', 'blue']; // here we will filter the array based on colours that // include the string 'red' const redColours = colours.filter(colour => colour.includes('red')); // this is us console logging the new colours array console.log(redColours); // the above will log: ['dark red', 'light red', 'red'];
This is a good method for filtering array items based on a string, a text length, or anything else. As you can see in this example, we have performed another method; the Includes() method, within the filter method.