Differences Between Objects and Arrays in JavaScript

Basic Definition

• Arrays: Ordered collections of values accessed by index
• Objects: Collections of key-value pairs (properties)

Syntax

Arrays: Created using square brackets []

const fruits = [‘apple’, ‘banana’, ‘orange’];

Objects: Created using curly braces {}

const person = { name: ‘John’, age: 30, city: ‘New York’ };

Accessing Elements

Arrays: Use numeric indices starting from 0

const firstFruit = fruits[0]; // ‘apple’

Objects: Use keys (strings or symbols)

const personName = person.name; // ‘John’ // OR const personName = person[‘name’]; // ‘John’

Order

• Arrays: Maintain insertion order
• Objects: Prior to ES2015, order was not guaranteed; now they generally maintain insertion order but with some exceptions

Methods and Properties

• Arrays: Have built-in methods like push(), pop(), map(), filter(), reduce(), etc.
• Objects: Have methods like Object.keys(), Object.values(), Object.entries()

Length

Arrays: Have a length property that automatically updates

fruits.length; // 3

Objects: No built-in length property (need to use Object.keys(obj).length)

Iteration

Arrays

for (let i = 0; i < fruits.length; i++) { /* ... */ }
// OR
fruits.forEach(fruit => { /* ... */ });
// OR
for (const fruit of fruits) { /* ... */ }

Objects

for (const key in person) { /* ... */ }
// OR
Object.keys(person).forEach(key => { /* ... */ });
// OR
Object.entries(person).forEach(([key, value]) => { /* ... */ });

Use Cases

• Arrays: Best for ordered collections of similar items
• Objects: Best for representing entities with named properties

Type Checking

Array.isArray(fruits); // true
Array.isArray(person); // false
typeof fruits; // 'object' (arrays are objects in JS)
typeof person; // 'object'

Arrays in JavaScript are actually specialized objects with numeric keys and additional array-specific behaviors and methods.