Next ❯

Arrays Overview

  • This lesson introduces arrays and their role in JavaScript programming.

  • Introduction to Arrays

    In real-world programming, we often deal with multiple values of the same type.

    For example:

    • List of student names

    • Marks of a student

    • Prices of products

    • Numbers entered by a user

    Storing each value in a separate variable is not practical.

    This problem is solved using arrays.

    What is an Array ?

    An array is a special variable that can store multiple values in a single variable, using a common name.

    Simple Definition

    An array is a collection of values stored in ordered form, where each value has a position (index).

    Why Do We Need Arrays ?

    Without arrays:

    let student1 = "Rahul";

    let student2 = "Kamlesh";

    let student3 = "Switty";

    Problems:

    • Too many variables

    • Hard to manage

    • Difficult to loop

    With arrays:

    let students = ["Rahul", "Kamlesh", "Switty"];

    Advantages:

    • Clean code

    • Easy access

    • Easy looping

    • Better memory management

    Key Characteristics of JavaScript Arrays

    • Arrays are objects in JavaScript

    • Arrays can store multiple data types

    • Arrays are zero-indexed

    • Array size is dynamic

    Creating an Array in JavaScript

    There are two common ways to create arrays.

    Method 1: Using Array Literal (Recommended)

    let numbers = [10, 20, 30, 40];

    Method 2: Using Array Constructor

    let numbers = new Array(10, 20, 30, 40);

    Array literal method is preferred because it is simpler and safer.

    Accessing Array Elements

Accessing Array Elements

Retrieves values from an array using index positions starting from zero. 

// Accessing array elements using index

let fruits = ["Apple", "Banana", "Mango"];

console.log(fruits[0]); // Apple
console.log(fruits[1]); // Banana
console.log(fruits[2]); // Mango
  • Array Index Explanation
    IndexValue
    0Apple
    1Banana
    2Mango
    Modifying Array Elements

Modifying Array Elements

Updates array values by assigning a new value to a specific index. 

// Modifying array element

let fruits = ["Apple", "Banana", "Mango"];

fruits[1] = "Orange";

console.log(fruits); // ["Apple", "Orange", "Mango"]
  • Length of an Array

Array Length Property

Gives the total number of elements present in an array. 

// Getting array length

let fruits = ["Apple", "Banana", "Mango"];

console.log(fruits.length); // 3
  • Adding Elements to an Array

Adding Elements Using Index

Inserts a new value into an array by assigning it to a new index. 

// Adding element using index

let numbers = [1, 2, 3];

numbers[3] = 4;

console.log(numbers); // [1, 2, 3, 4]
  • Removing Elements from an Array

Removing Elements Using length

Cuts off elements by reducing the array length. 

// Removing element using length

let numbers = [1, 2, 3, 4];

numbers.length = 3;

console.log(numbers); // [1, 2, 3]

  • Arrays Can Store Multiple Data Types

    let mixedArray = [10, "Hello", true, null];

    This is allowed in JavaScript.

    Array vs Variables

    FeatureVariableArray
    StoresSingle valueMultiple values
    ManagementDifficult for many valuesEasy
    LoopingNot possibleEasy
    UsageSmall dataLarge data

    Looping Through an Array

Looping Through Array

Iterates over each element of an array using a for loop. 

// Loop through array

let fruits = ["Apple", "Banana", "Mango"];

for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]);
}

  • Arrays work perfectly with loops.

    Real-Life Analogy

    • Variables are like single boxes

    • Arrays are like a box with compartments

    • Each compartment has a number (index)

    Common Mistakes

    • Forgetting that index starts from 0

    • Accessing invalid index

    • Confusing array length with last index

    • Using wrong brackets

    Best Practices for Arrays

    • Use meaningful array names

    • Prefer array literals

    • Always check array length

    • Use loops for processing data

    • Avoid hard-coded index values

Next ❯