# JavaScript Array Methods That You Need To Know

1. **Array.from()**
    
    Convert an iterable into an array. Can also be done with the spread operator \[…iterable\].
    
2. **Array.isArray()**
    
    Check if a value is an array.
    
3. **.includes()**
    
    Check if the array contains a given value.
    
    ```javascript
    [1, 2, 7, -1, 4].includes(-1) // true
    ```
    
4. **.forEach()** & **.map()**
    
    They both loop through an array. .forEach() is mainly for iterating over the loop. .map() returns a new array with the transformation.
    
5. **.filter()**
    
    Return an array that is truthy with the given condition.
    
    ```javascript
    [1, 2, 3, 5, 7, -1, 4].filter(value => value < 4); // [1, 2, 3, -1]
    ```
    
6. **.reduce()**
    
    Probably the most versatile method of Array. It allows you to loop through an array, do any operations, and return anything you like.
    
    ```javascript
    const fruits = ["apple", "banana", "apple", "orange", "banana", "apple"];
    const fruitCounts = fruits.reduce((accumulator, fruit) => {
      accumulator[fruit] = (accumulator[fruit] || 0) + 1;
      return accumulator;
    }, {}); // fruitCounts is { apple: 3, banana: 2, orange: 1 }
    ```
    
7. **.join()**
    
    Convert an array into a string.
    
8. **.concat()**
    
    Return a new array with additional items. The difference with .push is that .concat doesn’t mutate the original array.
    
    ```javascript
    const array = [1, 2, 3];
    const newArray = array.concat(4, 5); // [1, 2, 3, 4, 5]
    const anotherArray = array.concat([4, 5], [6]); // [1, 2, 3, 4, 5, 6]
    const nestedArray = array.concat([[4, 5]], [6]); // [1, 2, 3, [4, 5], 6]
    ```
    
9. **.slice()**
    
    Retrieve part of the array using the optional arguments - .slice(startIndex, endIndex). startIndex is default to 0, and endIndex is default to the length of the array.
    
    ```javascript
    const array = [1, 2, 3, 4, 5, 6, 7]
    const array1 = array.slice() // shallow copy of array [1, 2, 3, 4, 5, 6, 7]
    const array2 = array.slice(1, array.length - 1) // [2, 3, 4, 5, 6]
    const array3 = array.slice(-2) // last two values
    const array4 = array.slice(-10) // greater than the length, same as .slice()
    ```
    
10. **.reverse()**
    
    Change an array to be in reverse order.
    
    ```javascript
    let array = [1, 2, 3, 4];
    array.reverse(); // array is now [4, 3, 2, 1]
    ```
    
11. .**flat()**
    
    Flatten a nested array. The default flatten level is 1.
    
    ```javascript
    const nestedArray = [1, [[[2, 3], 4], 5]];
    const flattenedNestedArray = nestedArray.flat(); // [1, [[[2, 3], 4], 5]]
    const flattenedNestedArrayL3 = nestedArray.flat(3); // [1, 2, 3, 4, 5]
    ```
    
12. **.push()** & **.pop()**
    
    .push() - add items to the end of the array.
    
    .pop() - remove the last item from the array.
    
    ```javascript
    let array = [1, 2, 3];
    array.push(4, 5); // array is now [1, 2, 3, 4, 5]
    array.pop(); // array is now [1, 2, 3, 4]
    ```
    
13. **.shift()** & .**unshift()**
    
    .unshift() - add items to the beginning of the array.
    
    .shift() - remove the first item from the array.
    
    ```javascript
    let array = [2, 3, 4];
    array.unshift(0, 1); // array is now [0, 1, 2, 3, 4]
    array.shift(); // array is now [1, 2, 3, 4]
    ```
    
14. **.sort()**
    
    Sort an array alphabetically by default. Note that it modifies the original array. So the best practice is to make a copy using .slice() or the spread operator.
    
    ```javascript
    const users = [
      { id: 1, name: 'Alice', email: 'alice@example.com', isActive: true },
      { id: 2, name: 'Bob', email: 'bob@example.com', isActive: false },
      { id: 3, name: 'Charlie', email: 'charlie@example.com', isActive: true },
    ];
    
    const activeUserEmailsSorted = users
      .filter(user => user.isActive) // filter to keep the active users
      .map(user => user.email.toUpperCase()) // keep the emails in uppercase only
      .sort(); // sort the emails alphabetically
    
    // activeUserEmailsSorted is ["ALICE@EXAMPLE.COM", "CHARLIE@EXAMPLE.COM"]
    ```
    
    To sort an array of numbers in ascending order
    
    ```javascript
    const numbers = [40, 100, 1, 6, 25, 10];
    [...numbers].sort((a, b) => a - b); // [1, 6, 10, 25, 40, 100]
    ```
