JavaScript array() methods, every JavaScript developer must know

JavaScript array() methods, every JavaScript developer must know

**1. push() method allows us to add one or more items at the end of an array.** **Example:** ``` let numbers = [1,2,3,4,5]; numbers.push(6); // Adding 6 at the end of the array console.log(numbers); // [1,2,3,4,5,6] ``` **2. pop() method allows...

1. push() method allows us to add one or more item at the end of an array. Example:

let numbers = [1,2,3,4,5];
numbers.push(6); // Adding 6 at the end of the array
console.log(numbers); 
//Output: [1,2,3,4,5,6]

2. pop() method allows us to remove the item from the end of an array. Example:

let numbers = [1,2,3,4,5];
numbers.pop(); // Removing last item from the array
console.log(numbers); 
//Output: [1,2,3,4]

3. shift() method allow us to remove an item from the front of the array Example:

let numbers = [1,2,3,4,5];
numbers.shift(); // Removing the first item of the array
console.log(numbers); 
//Output: [2,3,4,5]

4. unshift() method allow us to add new items at the front of the array Example:

let numbers = [1,2,3,4,5];
numbers.unshift(0); // Adding ‘0’ at the beginning of the array
console.log(numbers);
//Output: [0,1,2,3,4,5]

5. forEach() method will help you to iterate over array's items. Example:

let numbers = [1, 2, 3, 4, 5];
numbers.forEach(item => {
    // Let's itrate the given array items and add 1 to each item.
    console.log(item + 1); 
});
//Output: 
2 
3 
4 
5 
6

6. includes() method return booleans to check either your array length includes the specific item passed in the method or not. Example:

let numbers = [1, 2, 3, 4, 5];
numbers.includes(0); 
//Output: false
numbers.includes(4); 
//Output: true

7. filter() method creates a new array with a subset of elements of the original array. Example:

Lets create an array object ‘names’ to apply filter()

let names = [
    {name: 'Shahab', age: 35},
    {name: 'Ibaad', age: 10},
    {name: 'Ayaan', age: 30},
    {name: 'Hamad', age: 20},
    {name: 'Pari', age: 22}
];
// Filtering names data by age > 10;
let filterd_items = names.filter(item => item.age > 10);
console.log(filterd_items);

// Output:
0: {name: "Shahab", age: 35}
1: {name: "Ayaan", age: 30}
2: {name: "Hamad", age: 20}
3: {name: "Pari", age: 22}

8. sort() method allows us to sort data and return the elements after changing the positions of the elements in the original array. The sort() method sorts the array elements in ascending order by default.

let numbers = [1, 5, 2, 0, 40, 3, 10 ];
numbers.sort();
console.log(numbers);
//Output:  [0, 1, 10, 2, 3, 40, 5]

Look at the above output given by sort() method and the output is not as per expected, To solve this issue, we need to pass a comparison function to the sort() method.

Example:

numbers.sort((a,b) => {
    if(a > b) return 1;
    if(a < b) return -1;
    return 0;
});
console.log(numbers);
//Output: [0, 1, 2, 3, 5, 10, 40]

9. splice() method allows us to delete items in an array, to get result we have to pass two arguments to the splice() method.

Syntax: Array.splice(position,num);

Example:

let numbers = [1,2,3,4,5];
let deletedNumbs = numbers.splice(0,2);

//The original numbers array now contains only 3 items. i.e: 3,4,5
console.log(numbers); //  [3,4,5]

The new deletedNumbs array contains the deleted items from the original array
console.log(deletedNumbs); // [1, 2]

10. map() method take an array, manipulate its elements, and return a new array by calling the provided function in every element.

Example:

let numbers = [1,2,3,4,5];
Let's multiply each item and get the output doubled
let output = numbers.map(item => item * 2)
console.log(output);
//Output: [2, 4, 6, 8, 10]

javascript array methods arrowfunction

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

Learn Arrays And Array Methods in JavaScript

In JavaScript, an array is a data structure that contains list of elements which store multiple values in a single variable. The strength of JavaScript arrays lies in the array methods. Array methods are functions built-in to JavaScript that we can apply to our arrays — Each method has a unique function that performs a change or calculation to our array and saves us from writing common functions from scratch. In this video we are going to learn arrays and array methods like sort(), reverse(), join(), split(), pop(), push(), shift(), unshift(), toString(), delete array, etc.......

9 Must Know JavaScript Array Methods

Arrays are one of the most common things that you're going to use as a programmer. So, I'm going to explain nine JavaScript array methods that are going to make your life so much easier and more enjoyable. Simplify your code by understanding when to use different array methods in JavaScript. In this post, you'll see 9 Must Know JavaScript Array Methods

Convert String To Array Using Javascript Split Method

In this tutorial, you’ll be going to learn how to convert string to array using javascript split method. The easiest approach to use javascript built-in method String.split(). JavaScript split string method return array of a substring after splitting a string based on the separator you provide. The separator might be a string, special character or […]

Increase Performance of React Applications Via Array JavaScript Methods

Increase Performance of React Applications Via Array JavaScript Methods. We will create a simple event management application in the react to add, update, and delete an event.

Javascript Array forEach() Method Example

Javascript array foreach() is an inbuilt function that can be used to execute a function on each item in the array. The forEach can be used on Arrays, Maps.