"If a worker wants to do his job well, he must first sharpen his tools." - Confucius, "The Analects of Confucius. Lu Linggong"
Front page > Programming > Exploring JavaScript Array Methods with Examples

Exploring JavaScript Array Methods with Examples

Published on 2024-09-14
Browse:248

Exploring JavaScript Array Methods with Examples

JavaScript arrays are versatile and offer a wide range of built-in methods to manipulate, iterate, and manage data efficiently. Understanding these methods is crucial for effective programming. Let's delve into some commonly used array methods with practical examples.

Array Methods

  • push(): Adds one or more elements to the end of an array and returns the new length of the array.
let fruits = ['apple', 'banana'];
fruits.push('orange');  // returns 3 (new length of array)
console.log(fruits);    // Output: ['apple', 'banana', 'orange']
  • pop(): Removes the last element from an array and returns that element.
let fruits = ['apple', 'banana', 'orange'];
let lastFruit = fruits.pop();  // returns 'orange'
console.log(fruits);           // Output: ['apple', 'banana']
console.log(lastFruit);        // Output: 'orange'
  • shift(): Removes the first element from an array and returns that removed element.
let fruits = ['apple', 'banana', 'orange'];
let firstFruit = fruits.shift();  // returns 'apple'
console.log(fruits);              // Output: ['banana', 'orange']
console.log(firstFruit);          // Output: 'apple'
  • unshift(): Adds one or more elements to the beginning of an array and returns the new length of the array.
let fruits = ['banana', 'orange'];
fruits.unshift('apple');  // returns 3 (new length of array)
console.log(fruits);      // Output: ['apple', 'banana', 'orange']
  • forEach(): Executes a provided function once for each array element.
let numbers = [1, 2, 3];
numbers.forEach(function(num) {
  console.log(num * 2);  // Output: 2, 4, 6
});
  • map(): Creates a new array populated with the results of calling a provided function on every element in the calling array.
let numbers = [1, 2, 3];
let doubled = numbers.map(function(num) {
  return num * 2;
});
console.log(doubled);  // Output: [2, 4, 6]
  • filter(): Creates a new array with all elements that pass the test implemented by the provided function.
let numbers = [1, 2, 3, 4, 5];
let evens = numbers.filter(function(num) {
  return num % 2 === 0;
});
console.log(evens);  // Output: [2, 4]
  • find(): Returns the first element in the array that satisfies the provided testing function.
let numbers = [10, 20, 30, 40, 50];
let found = numbers.find(function(num) {
  return num > 25;
});
console.log(found);  // Output: 30
  • reduce(): Applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single value.
let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce(function(acc, current) {
  return acc   current;
}, 0);
console.log(sum);  // Output: 15 (1   2   3   4   5)
  • indexOf(): Returns the first index at which a given element can be found in the array, or -1 if it is not present.
let fruits = ['apple', 'banana', 'orange', 'apple'];
let index = fruits.indexOf('apple');  // returns 0
console.log(index);                   // Output: 0
  • lastIndexOf(): Returns the last index at which a given element can be found in the array, or -1 if it is not present.
let fruits = ['apple', 'banana', 'orange', 'apple'];
let lastIndex = fruits.lastIndexOf('apple');  // returns 3
console.log(lastIndex);                      // Output: 3

These array methods are fundamental tools for manipulating data structures in JavaScript efficiently. By mastering these methods, you'll gain a powerful toolkit for handling arrays in various programming scenarios.

Release Statement This article is reproduced at: https://dev.to/suleman_ahmed_rajput/exploring-javascript-array-methods-with-examples-3p90?1 If there is any infringement, please contact [email protected] to delete it
Latest tutorial More>

Disclaimer: All resources provided are partly from the Internet. If there is any infringement of your copyright or other rights and interests, please explain the detailed reasons and provide proof of copyright or rights and interests and then send it to the email: [email protected] We will handle it for you as soon as possible.

Copyright© 2022 湘ICP备2022001581号-3