In JavaScript, arrays are a commonly used data structure for storing a sequence of elements. JavaScript provides various methods for managing and manipulating array data. This section covers commonly used array methods, their differences, and appropriate use cases.
1. push() and pop()
push()adds one or more elements to the end of the array and returns the new length of the array.pop()removes the last element of the array and returns the removed element.
Use case: These methods are ideal for implementing a stack structure (LIFO).
Example:
javascriptlet fruits = ['apple', 'banana']; fruits.push('orange'); // returns new array length, fruits becomes ['apple', 'banana', 'orange'] let lastFruit = fruits.pop(); // returns 'orange', fruits reverts to ['apple', 'banana']
2. shift() and unshift()
shift()removes the first element of the array and returns it.unshift()adds one or more elements to the beginning of the array and returns the new length of the array.
Use case: These methods are suitable for manipulating elements at the front of the array, such as when implementing a queue structure (FIFO).
Example:
javascriptlet numbers = [1, 2, 3]; numbers.unshift(0); // returns new array length, numbers becomes [0, 1, 2, 3] let firstNumber = numbers.shift(); // returns 0, numbers reverts to [1, 2, 3]
3. map() and filter()
map()creates a new array where each element is the result of applying a provided function to the corresponding element.filter()creates a new array containing elements that pass a test implemented by the provided function.
Use case: map() is used for transforming each element in the array, while filter() is used for filtering elements that meet specific criteria.
Example:
javascriptlet numbers = [1, 2, 3, 4]; let squares = numbers.map(x => x * x); // returns new array [1, 4, 9, 16] let evens = numbers.filter(x => x % 2 === 0); // returns new array [2, 4]
4. reduce()
reduce()executes a provided reducer function on each element of the array, accumulating the results into a single return value.
Use case: Used for accumulating array elements through summation, multiplication, or other specific logic to produce a single value.
Example:
javascriptlet numbers = [1, 2, 3, 4]; let sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); // returns 10
5. forEach()
forEach()executes a provided function on each element of the array.
Use case: Used for iterating over array elements to perform operations without returning a new array.
Example:
javascriptlet letters = ['a', 'b', 'c']; letters.forEach(letter => console.log(letter)); // prints 'a', 'b', 'c' sequentially
These are commonly used array methods in JavaScript. Developers should select the appropriate method based on specific use cases and requirements to handle array data more efficiently.