Array Operations Visualization

Interactive Demonstration

Visualize common array operations: Access, Insertion, and Deletion.

Initial Array (comma-separated):

Index: O(1)

Index: Value: O(n)

Index: O(n)

Enter an initial array or perform an operation.

How Array Operations Work

Access (O(1)): Retrieving an element at a specific index is very fast. Since arrays store elements contiguously, the memory address can be calculated directly: address = base_address + index * element_size.
Insertion (O(n)): Adding an element at a specific index requires shifting all subsequent elements one position to the right to make space. In the worst case (inserting at the beginning), this takes time proportional to the number of elements (n). Inserting at the end is O(1) if there's space (amortized O(1) for dynamic arrays).
Deletion (O(n)): Removing an element at a specific index requires shifting all subsequent elements one position to the left to fill the gap. Similar to insertion, the worst case (deleting from the beginning) is O(n). Deleting from the end is O(1).

Example Implementation (Conceptual)

class ArrayWrapper {
    constructor() {
        this.array = [];
    }

    access(index) {
        if (index < 0 || index >= this.array.length) {
            throw new Error("Index out of bounds");
        }
        // Direct access: O(1)
        return this.array[index];
    }

    insert(index, value) {
        if (index < 0 || index > this.array.length) { // Allow inserting at the end
            throw new Error("Index out of bounds");
        }
        // Shift elements: O(n)
        this.array.splice(index, 0, value);
    }

    delete(index) {
        if (index < 0 || index >= this.array.length) {
            throw new Error("Index out of bounds");
        }
        // Shift elements: O(n)
        this.array.splice(index, 1);
    }
}