Detailed explanation of JavaScript array methods

This article will delve into the commonly used array methods in JavaScript, covering elements addition and deletion, search, conversion, sorting, combination and iteration, etc., and provide code examples to help you better understand and apply these methods.

1. Adding and deleting elements

• push(): Add elements to the end of the array.

let fruits = ["apple", "banana"];
fruits.push("cherry");
console.log(fruits); // Output: ["apple", "banana", "cherry"]

• pop(): Delete the last element of the array.

fruits.pop();
console.log(fruits); // Output: ["apple", "banana"]

• unshift(): Add elements to the beginning of the array.

fruits.unshift("mango");
console.log(fruits); // Output: ["mango", "apple", "banana"]

• shift(): Delete the beginning element of the array.

fruits.shift();
console.log(fruits); // Output: ["apple", "banana"]

2. Find and search

• indexOf(): Returns the index of the first occurrence of the specified element in the array.

let numbers = [10, 20, 30, 40];
console.log(numbers.indexOf(20)); // Output: 1

• includes(): Check whether the array contains the specified element.

console.log(numbers.includes(30)); // Output: true
console.log(numbers.includes(50)); // Output: false

3. Array conversion

• map(): Create a new array whose elements are the results of processing the original array elements through the callback function.

let numbers = [1, 2, 3];
let squares = numbers.map(num => num * num);
console.log(squares); // Output: [1, 4, 9]

• filter(): Create a new array whose elements are the elements in the original array that meet the specified conditions.

let evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // Output: [2]

• reduce(): Accumulate array elements into a value.

let sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum); // Output: 6

4. Sorting

• sort(): Sort the array (default alphabetically). Numbers require a custom comparator.

let fruits = ["banana", "apple", "cherry"];
fruits.sort();
console.log(fruits); // Output: ["apple", "banana", "cherry"]

let numbers = [10, 5, 20];
numbers.sort((a, b) => a - b); // 升序
console.log(numbers); // Output: [5, 10, 20]

• reverse(): Reverse the array.

fruits.reverse();
console.log(fruits); // Output: ["cherry", "banana", "apple"]

5. Array combination and extraction

• concat(): Merge two or more arrays.

let arr1 = [1, 2];
let arr2 = [3, 4];
let combined = arr1.concat(arr2);
console.log(combined); // Output: [1, 2, 3, 4]

• slice(): Extract part of the array without modifying the original array.

let numbers = [10, 20, 30, 40];
let sliced = numbers.slice(1, 3);
console.log(sliced); // Output: [20, 30]

• splice(): Add or remove elements from the array.

let fruits = ["apple", "banana", "cherry"];
fruits.splice(1, 1, "orange", "grape");
console.log(fruits); // Output: ["apple", "orange", "grape", "cherry"]

6. Array iteration

• forEach(): Execute a function for each element in the array.

let numbers = [1, 2, 3];
numbers.forEach(num => console.log(num * 2)); // Output: 2, 4, 6

7. Other common methods

• join(): Convert an array to a string, using the specified delimiter.

let fruits = ["apple", "banana", "cherry"];
console.log(fruits.join(", ")); // Output: "apple, banana, cherry"

• find(): Returns the first element that meets the specified condition.

let numbers = [10, 20, 30];
let result = numbers.find(num => num > 15);
console.log(result); // Output: 20

• findIndex(): Returns the index of the first element that meets the specified condition.

console.log(numbers.findIndex(num => num > 15)); // Output: 1

• flat(): Flatten nested arrays.

let nested = [1, [2, 3], [4, [5]]];
console.log(nested.flat(2)); // Output: [1, 2, 3, 4, 5]

The above is the detailed content of Javascript - Array methods. For more information, please follow other related articles on the PHP Chinese website!