Home > Web Front-end > JS Tutorial > JavaScript Array Methods You Should Know

JavaScript Array Methods You Should Know

WBOY
Release: 2024-07-17 17:44:22
Original
260 people have browsed it

Métodos de Arrays em JavaScript que Você Deveria Saber

Arrays are an essential part of JavaScript programming, providing a powerful way to store and manipulate collections of data. In this article, we will explore eighteen fundamental array methods that every JavaScript programmer should know to write more efficient and clear code.

1. Push

The arr.push(..element) method adds a new element to the end of an array and returns the new length of the array. This method changes the original array.

Syntax:

arr.push(element1, element2, …)
Copy after login
e

Example:

let arr = [1, 2, 3];
arr.push(4); // arr agora é [1, 2, 3, 4]
Copy after login
e

2. Pop

The arr.pop() method removes the last element from an array and returns the removed element. This method also changes the original array and its length.

Syntax:

arr.pop()
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
arr.pop(); // arr agora é [1, 2, 3]
Copy after login
e

3. Shift

The arr.shift() method removes the first element from an array and returns the removed element. This method also changes the length of the original array.

Syntax:

arr.shift()
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
arr.shift(); // arr agora é [2, 3, 4]
Copy after login
e

4. Unshift

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

Syntax:

arr.unshift(item1, item2, …)
Copy after login
e

Example:

let arr = [2, 3, 4];
arr.unshift(1); // arr agora é [1, 2, 3, 4]
Copy after login
e

5. Splice

The arr.splice() method modifies the original array by removing, replacing or adding elements.

Syntax:

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
arr.splice(1, 1); // arr agora é [1, 3, 4]
Copy after login
e

6. Slice

The arr.slice() method selects a part of an array and returns a new array with the items copied from the beginning index to the end. The original array is not changed.

Syntax:

arr.slice(start, end)
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
let newArr = arr.slice(1, 3); // newArr é [2, 3]
Copy after login
e

7. Includes

The arr.includes(item, index) method checks if the item is present in the array from the given index and returns true if found, otherwise returns false.

Syntax:

arr.includes(item, index)
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
arr.includes(3); // true
Copy after login
e

8. forEach

The arr.forEach() method executes a given function once for each element of the array.

Syntax:

arr.forEach(callback)
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
arr.forEach(num => console.log(num)); // imprime 1, 2, 3, 4
Copy after login
e

9. Join

The arr.join(separator) method creates a string with all the elements of an array concatenated, separated by a specific delimiter.

Syntax:

arr.join(separator)
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
arr.join('-'); // "1-2-3-4"
Copy after login
e

10. toString

The arr.toString() method converts an array to a string and returns the result.

Syntax:

arr.toString()
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
arr.toString(); // "1,2,3,4"
Copy after login
e

11. Map

The map() method calls a callback function on each element of the original array and returns a new array with the results. This is a non-mutating method.

Syntax:

  arr.map(function callback(currentValue, index, array) {
    // Retorna um novo valor
  })
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
let doubled = arr.map(num => num * 2); // [2, 4, 6, 8]
Copy after login
e

12. Reduce

The reduce() method applies a function to an accumulator and each array element (from left to right) to reduce to a single value.

Syntax:

arr.reduce(function callback(accumulator, currentValue, index, array) {
  // Retorna o valor acumulado
}, initialValue)
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
let sum = arr.reduce((acc, num) => acc + num, 0); // 10
Copy after login
e

13. Filter

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

Syntax:

arr.filter(function callback(element, index, array) {
  // Retorna true para manter o elemento
})
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
let even = arr.filter(num => num % 2 === 0); // [2, 4]
Copy after login
e

14. Sort

The sort() method arranges the elements of an array in ascending order or according to the given comparison function.

Syntax:

arr.sort([compareFunction])
Copy after login
e

Example:

let arr = [4, 2, 3, 1];
arr.sort(); // [1, 2, 3, 4]
Copy after login
e

15.Find

The find() method returns the first element in the array that satisfies the given test function.

Syntax:

arr.find(function callback(element, index, array) {
  // Retorna true para encontrar o elemento
})
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
let found = arr.find(num => num > 2); // 3
Copy after login
e

16. IndexOf

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

Syntax:

arr.indexOf(searchElement, fromIndex)
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
let index = arr.indexOf(3); // 2
Copy after login
e

17. Add

The some() method tests whether at least one element in the array passes the implemented test function.

Syntax:

arr.some(function callback(element, index, array) {
  // Retorna true se pelo menos um elemento passar no teste
})
Copy after login
e

Example:

let arr = [1, 2, 3, 4];
let hasEven = arr.some(num => num % 2 === 0); // true
Copy after login

18. Concat

O método concat() é usado para mesclar dois ou mais arrays.

Sintaxe:

arr.concat(array2, array3, ..., arrayN)
Copy after login

Exemplo:

let arr1 = [1, 2];
let arr2 = [3, 4];
let merged = arr1.concat(arr2); // [1, 2, 3, 4]
Copy after login

Esses métodos são fundamentais para trabalhar com arrays em JavaScript. Dominar esses métodos permitirá que você manipule dados de forma mais eficiente e escreva códigos mais limpos e legíveis. Feliz codificação!

Referências:

  • 10 Important JavaScript Array Methods You Must Know
  • Lists of Top 10 JavaScript array methods a beginner Js developer should know

The above is the detailed content of JavaScript Array Methods You Should Know. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template