Mastering JavaScript Array Methods: A Comprehensive Guide to Boost Your Coding Efficiency

Today, We will learn Mastering JavaScript Array Methods: A Comprehensive Guide to Boost Your Coding Efficiency.
In this tutorial, I will give you Mastering JavaScript Array Methods: A Comprehensive Guide to Boost Your Coding Efficiency. Explore the power of JavaScript array methods with this in-depth guide. Learn to wield map, filter, reduce, and more, unlocking efficiency and elegance in your coding journey.

JavaScript Array Methods

1. push()

The push() function adds one or more elements to the end of an array and returns the new length of the array.

const numbers = [1, 2, 3];
numbers.push(4, 5);
console.log(numbers);

// [1, 2, 3, 4, 5]

2. pop()

The pop() Removes the last elements from the array and returns that element.

const numbers = [1, 2, 3, 4, 5];
const last_number = numbers.pop();
console.log(last_number);

// 5

3. shift()

The shift() removes the first element from an array and returns that element.

const numbers = [1, 2, 3, 4, 5];
const first_number = numbers.shift();
console.log(first_number);
// 1

4. unshift()

The unshift() Adds one or more elements to the beginning of an array and returns the new length of the array.

const numbers = [1, 2, 3, 4, 5];
numbers.unshift(0, -1);
console.log(numbers);

// [0, -1, 1, 2, 3, 4, 5]

5. find()

The find() returns the value of the first element in the array that satisfies the provided testing function. Otherwise, undefined is returned.

const numbers = [1, 2, 3, 4, 5];
const found_number = numbers.find((num) => num > 3);
console.log(found_number);
// 4

6. some()

The some() is tests whether at least one element in the array passes the test implemented by the provided function. it returns true if any element passes the test, Otherwise, it returns false.

const numbers = [1, 2, 3, 4, 5];
const has_event_number = numbers.some((num) => num % 2 == 0);
console.log(has_event_number);

// true

7. every()

the every() tests whether all elements in the array pass the test implemented by the provided function. it returns true if any element passes the test, Otherwise, it returns false.

const numbers = [1, 2, 3, 4, 5];
const all_event_number = numbers.some((num) => num % 2 == 0);
console.log(all_event_number);

// false

8. sort()

the sort sorts the elements of an array in place and returns the sorted array. the default sort order is built upon converting the elements into strings, and then comparing their sequences of UTF-16 code unit values.

const cars = ['swift', 'baleno', 'BMW', 'Audi'];
cars.sort();
console.log(cars);

// ['Audi', 'baleno', 'BMW', 'swift']

const numbers = [200, 45, 100, 6, 8];
numbers.sort((a, b) => a - b);
console.log(numbers);

//  [6, 8, 45, 100, 200]

9. includes()

The includes () determines whether an array includes a certain element, returning true or false as appropriate.

const numbers = [1, 2, 3, 4, 5];
const includes_there = numbers.includes(3);
console.log(includes_there);

// true

10. slice()

the slice() returns a shallow copy of a portion of an array into a new array object selected from start to end (end not included). the original array will not be modified.

const numbers = [1, 2, 3, 4, 5];
const slice_number = numbers.slice(0, 2);
console.log(slice_number);

// [1, 2]

11. map()

the map() creates a new array with the results of calling a provided function on every element in the calling array.

const numbers = [1, 2, 3, 4, 5];
const doubled_number = numbers.map((num) => num * 2);
console.log(doubled_number);

// [2, 4, 6, 8, 10]

12. filter()

the filter() creates a new array with all elements that pass the test implemented by the provided function.

const numbers = [1, 2, 3, 4, 5, 6];
const even_number = numbers.filter((num) => num % 2 == 0);
console.log(even_number);

// [2, 4, 6]

13. reduce()

The reduce() executes a reducer function on each element of the array, resulting in a single output value.

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((total, num) => total + num, 0);
console.log(sum);

// 15

14. forEach()

the forEach() executes a provided function once for each array element.

const numbers = [1, 2, 3, 4, 5];
numbers.forEach((num) =>
    console.log(num * 2)
);

// 2, 4, 6, 8, 10

15. indexOf()

the indexOf() returns the first index at which a given element can be found in the array, or -1 if it is not present.

const cars = ['swift', 'baleno', 'BMW', 'Audi'];
const bmw_index = cars.indexOf('baleno');
console.log(bmw_index);

//1

16. lastIndexOf()

the lastIndexOf() returns the last index at which a given element can be found in the array, or -1 if it is not present.

const cars = ['swift', 'baleno', 'BMW', 'Audi'];
const bmw_index = cars.lastIndexOf('Audi');
console.log(bmw_index);

//3

17. reverse()

the reverse() reverses the order of the elements of an array in place. The first element becomes the last, and the last element becomes the first.

const numbers = [1, 2, 3, 4, 5];
numbers.reverse();
console.log(numbers);

//[5, 4, 3, 2, 1]

18. concat()

the concat() Returns a new array that includes elements from the original array and additional elements.

const numbers = [1, 2, 3];
const more_numbers = [4, 5];
const all_number = numbers.concat(more_numbers);
console.log(all_number);

//[1, 2, 3, 4, 5]

19. join()

the join() joins all elements of an array into a string. the elements are separated by a specified separator string.

const cars = ['swift', 'baleno', 'BMW', 'Audi'];
const join_car = cars.join(" - ");
console.log(all_number);

//'swift - baleno - BMW - Audi'

20. toString()

the toString() returns a string representing the specified number or array and its elements.

const numbers = [1, 2, 3, 4, 5];
const num_string = numbers.toString();
console.log(num_string);

// '1, 2, 3, 4, 5'