Arrays & Methods

Master working with arrays and their powerful built-in methods in JavaScript.

Present State

Arrays in JavaScript are versatile list-like objects used to store multiple values in a single variable. JavaScript offers a rich set of built-in methods to manipulate arrays easily, allowing for sorting, filtering, transforming, and iterating over data effectively.

Code Example

Example demonstrating common array methods:

JavaScript Array Methods Example

// Define an array of numbers
const numbers = [1, 2, 3, 4, 5];

// Use map() to create a new array with each number doubled
const doubled = numbers.map(num => num * 2);

// Use filter() to get numbers greater than 2
const filtered = numbers.filter(num => num > 2);

// Use reduce() to sum all numbers
const sum = numbers.reduce((acc, curr) => acc + curr, 0);

// Output results
console.log('Original:', numbers);
console.log('Doubled:', doubled);
console.log('Filtered (>2):', filtered);
console.log('Sum:', sum);
          

This code demonstrates:

  • Creating arrays and accessing elements.
  • Using map() for transformation.
  • Filtering arrays with filter().
  • Aggregating values using reduce().
  • Logging results to the console.

Description

Arrays: Ordered collections of values stored under a single variable. Arrays can hold any type of data including numbers, strings, objects, and even other arrays.

Common Array Methods:

  • push() - Adds one or more elements to the end.
  • pop() - Removes the last element.
  • shift() - Removes the first element.
  • unshift() - Adds elements to the beginning.
  • map() - Creates a new array by applying a function to each element.
  • filter() - Creates a new array with elements that pass a test.
  • reduce() - Executes a reducer function on each element to reduce the array to a single value.
  • forEach() - Executes a function for each element (no return).
  • find() - Returns the first element that satisfies a condition.
  • includes() - Checks if an array contains a value.
  • sort() - Sorts the array elements.

These methods empower developers to manipulate arrays efficiently and elegantly in JavaScript.

Applications

  • Processing lists of data such as user inputs, API responses, or database records.
  • Transforming data for rendering in UI components like tables, lists, and charts.
  • Filtering and sorting data for search and navigation features.
  • Aggregating numerical data like totals, averages, and statistics.
  • Building complex data pipelines using chained array methods.

Multiple Choice Questions

Q1: Which method creates a new array by applying a function to every element?

  • A. filter()
  • B. map()
  • C. reduce()
  • D. forEach()

Answer: B. map()

Q2: How do you remove the last element from an array?

  • A. pop()
  • B. shift()
  • C. unshift()
  • D. splice()

Answer: A. pop()

Q3: What does the reduce() method do?

  • A. Filters elements based on a condition.
  • B. Creates a new array with transformed elements.
  • C. Combines all elements into a single value.
  • D. Loops over each element without returning a new array.

Answer: C. Combines all elements into a single value.

Q4: Which method checks if an array contains a specific element?

  • A. find()
  • B. includes()
  • C. indexOf()
  • D. some()

Answer: B. includes()