JavaScript Array Methods & ES6 Concepts

1. map() Method

Definition: map() creates a new array by transforming every element in an array using a callback function.

Important Points:

• Returns a new array.
• Does not modify the original array.

const months = ['January', 'February', 'March'];
const upperMonths = months.map(month => month.toUpperCase());
console.log(upperMonths);

Output: ["JANUARY", "FEBRUARY", "MARCH"]

2. filter() Method

Definition: Returns a new array containing elements that match a given condition.

Important Points:

• Used for filtering based on a condition.
• Returns only elements that evaluate true in the callback.

const nums = [1, 2, 3, 4, 5];
const even = nums.filter(num => num % 2 === 0);
console.log(even);

Output: [2, 4]

3. reduce() Method

Definition: Reduces an array to a single value (e.g., sum, product).

Important Points:

• Takes a callback with an accumulator and current value.
• Initial value is passed as the second argument.

const nums = [1, 2, 3];
const sum = nums.reduce((acc, val) => acc + val, 0);
console.log(sum);

Output: 6

4. some() Method

Definition: Returns true if at least one element satisfies the condition.

const nums = [5, 10, 15];
const hasBig = nums.some(n => n > 12);
console.log(hasBig);

Output: true

5. every() Method

Definition: Returns true if all elements satisfy the condition.

const nums = [5, 10, 15];
const allBig = nums.every(n => n > 2);
console.log(allBig);

Output: true

6. arguments Keyword

Definition: The arguments object is an array-like object that holds all arguments passed to a function.

Important Points:

• Works only in regular functions (not arrow functions).
• Useful for working with unknown number of parameters.

function add() {
    let sum = 0;
    for (let i = 0; i < arguments.length; i++) {
        sum += arguments[i];
    }
    return sum;
}
console.log(add(10, 20, 30));

Output: 60

7. ES6 Features

7.1 Default Parameters

Definition: You can set default values for function parameters.

function greet(name = "Guest") {
    return "Hello " + name;
}
console.log(greet());

Output: Hello Guest

7.2 Spread Operator (...)

Definition: Allows iterables (arrays, objects) to be expanded.

const arr1 = [1, 2, 3];
const arr2 = [4, 5];
const combined = [...arr1, ...arr2];
console.log(combined);

Output: [1, 2, 3, 4, 5]

// Spread in objects
const obj1 = { a: 1 };
const obj2 = { b: 2 };
const merged = { ...obj1, ...obj2 };
console.log(merged);

Output: { a: 1, b: 2 }

7.3 Rest Parameters

Definition: Rest parameters allow a function to accept an indefinite number of arguments as an array.

Important Points:

• Uses the same syntax as spread ..., but for gathering arguments.
• Rest parameters must be the last in the function definition.

function sumAll(...numbers) {
    return numbers.reduce((total, num) => total + num, 0);
}
console.log(sumAll(5, 10, 15));

Output: 30

8. Destructuring

Definition: Destructuring allows unpacking values from arrays or properties from objects into distinct variables.

8.1 Object Destructuring

const user = {
    name: 'Priyanshu',
    age: 15,
    address: {
        city: 'Dehradun',
        state: 'Utrakhand'
    }
};

const { name, age } = user;
console.log(name, age); // Output: Priyanshu 15

Output: Priyanshu 15

8.2 Destructuring in Function Parameters

function intro({ age, name }) {
    console.log(age, name);
}

intro(user);

Output: 15 Priyanshu

8.3 Array Destructuring

const colors = ['red', 'green', 'yellow', 'pink', 'black'];
const [firstColor, secondColor] = colors;
console.log(firstColor, secondColor);

Output: red green

Summary

• map(): transform elements
• filter(): select elements
• reduce(): accumulate values
• some(): at least one matches
• every(): all must match
• arguments: all passed arguments in a function
• Default Parameters: define fallback values
• Spread Operator: combine arrays/objects or expand them
• Rest Parameters: gather multiple arguments into an array
• Destructuring: extract values from objects or arrays