DEV Community

Giovanni Galiero
Giovanni Galiero

Posted on

Esplorare i Metodi degli Array di JavaScript: La Tua Guida Definitiva - Parte 1

Gli array di JavaScript sono uno strumento potente per la memorizzazione e la manipolazione dei dati. Ma con il potere arriva la complessità e può essere difficile sapere quale metodo degli array utilizzare per un dato compito.
In questo articolo, copriremo i migliori 5 metodi degli array di JavaScript in modo da poterli padroneggiare e portare le tue competenze di codifica al livello successivo.

javascript-array

1 .map()
Il metodo .map() crea un nuovo array chiamando una funzione fornita su ogni elemento dell'array originale. È un ottimo modo per trasformare un array di dati in una nuova forma.

Esempio:

_Example 1_ const numbers = [1, 2, 3, 4, 5] // Use .map() to double each number const doubledNumbers = numbers.map(num => num * 2) console.log(doubledNumbers) // Output: [2, 4, 6, 8, 10] _Example 2_ const names = ['John', 'Jane', 'Jim'] // Use .map() to create an array of greetings const greetings = names.map(name => `Hello, ${name}!`) console.log(greetings) // Output: ['Hello, John!', 'Hello, Jane!', 'Hello, Jim!'] 
Enter fullscreen mode Exit fullscreen mode

2 .filter()
Il metodo .filter() crea un nuovo array con tutti gli elementi che superano il test implementato dalla funzione fornita. È un ottimo modo per estrarre un sottoinsieme di dati da un array.

Esempio:

_Example 1_ const numbers = [1, 2, 3, 4, 5] // Use .filter() to get all even numbers const evenNumbers = numbers.filter(num => num % 2 === 0) console.log(evenNumbers) // Output: [2, 4] _Example 2_ const words = ['dog', 'cat', 'elephant', 'bear', 'zebra']; // Use .filter() to get all words with more than 3 letters const longWords = words.filter(word => word.length > 3); console.log(longWords); // Output: ['elephant', 'bear', 'zebra'] 
Enter fullscreen mode Exit fullscreen mode

3 .reduce()
Il metodo .reduce() applica una funzione su un accumulatore e su ogni elemento dell'array (da sinistra a destra) per ridurre l'array a un singolo valore. È un ottimo modo per eseguire operazioni su un array di dati e restituire un singolo risultato.

Esempio:

_Example 1_ const numbers = [1, 2, 3, 4, 5] // Use .reduce() to find the sum of the numbers const sum = numbers.reduce((acc, num) => acc + num, 0) console.log(sum) // Output: 15 _Example 2_ const words = ['dog', 'cat', 'elephant', 'bear', 'zebra'] // Use .reduce() to concatenate all words into a sentence const sentence = words.reduce((acc, word) => `${acc} ${word}`, '') console.log(sentence) // Output: 'dog cat elephant bear zebra' 
Enter fullscreen mode Exit fullscreen mode

4 .sort()
Il metodo .sort() ordina gli elementi di un array in loco e restituisce l'array ordinato. Per impostazione predefinita, ordina gli elementi in ordine crescente in base ai loro punti codice Unicode.

La funziona sort può restituire:

  • un valore negativo se a deve essere ordinato prima di b
  • zero (0) se a e b sono uguali
  • un valore positivo se a deve essere ordinato dopo b

Esempio:

_Example 1_ const numbers = [5, 2, 4, 1, 3] // Use .sort() to sort the numbers in ascending order const sortedNumbers = numbers.sort((a, b) => a - b) console.log(sortedNumbers) // Output: [1, 2, 3, 4, 5] _Example 2_ const words = ['zebra', 'dog', 'cat', 'bear', 'elephant'] // Use .sort() to sort the words in alphabetical order const sortedWords = words.sort() console.log(sortedWords) // Output: ['bear', 'cat', 'dog', 'elephant', 'zebra'] 
Enter fullscreen mode Exit fullscreen mode

5 .forEach()
Il metodo .forEach() esegue una funzione fornita una volta per ogni elemento dell'array. A differenza di .map() e .filter(), .forEach() non restituisce un nuovo array.

Esempio:

const numbers = [1, 2, 3, 4, 5] // Use .forEach() to log each number numbers.forEach(num => console.log(num)) // Output: // 1 // 2 // 3 // 4 // 5 _Example 2_ const words = ['zebra', 'dog', 'cat', 'bear', 'elephant'] words.forEach((word, index) => { words[index] = word.charAt(0).toUpperCase() + word.slice(1) }) console.log(words) // Output: ['Zebra', 'Dog', 'Cat', 'Bear', 'Elephant'] 
Enter fullscreen mode Exit fullscreen mode

Conclusioni
In conclusione, questi sono i migliori 5 metodi per gli array di JavaScript che dovresti padroneggiare. Che tu stia trasformando dati, estraendo un sottoinsieme, riducendo ad un singolo valore, ordinando o eseguendo un'azione, c'è un metodo adatto al compito.

Con questi strumenti nel tuo kit, sarai in grado di affrontare qualsiasi problema relativo agli array con facilità.

Buon coding! ✌️

Top comments (0)