JavaScript Array Const
The const keyword is commonly used to declare arrays in JavaScript. However, const does not make the array immutable -- it only prevents reassignment of the variable. The array's contents can still be modified.
Const Arrays Can Be Mutated
When you declare an array with const, you cannot reassign the variable to a different array. But you can change, add, and remove elements from the existing array.
const fruits = ["Apple", "Banana", "Cherry"];
// You CAN change elements
fruits[0] = "Mango";
console.log("Changed element:", fruits);
// You CAN add elements
fruits.push("Date");
console.log("After push:", fruits);
// You CAN remove elements
fruits.pop();
console.log("After pop:", fruits);
// You CAN use splice
fruits.splice(1, 1, "Grape");
console.log("After splice:", fruits);Cannot Reassign Const Arrays
While you can modify the contents of a const array, you cannot reassign the variable itself. This applies to all const declarations, not just arrays.
const fruits = ["Apple", "Banana"];
// This would throw a TypeError:
// fruits = ["Cherry", "Date"];
// TypeError: Assignment to constant variable.
// This is fine -- modifying, not reassigning
fruits.length = 0; // empties the array
console.log("Emptied:", fruits);
fruits.push("Grape", "Melon");
console.log("Refilled:", fruits);
// With let, you CAN reassign
let colors = ["Red", "Blue"];
colors = ["Green", "Yellow"];
console.log("Reassigned:", colors);Object.freeze() for True Immutability
If you need a truly immutable array, use Object.freeze(). It prevents adding, removing, or changing elements. Note that freeze is shallow -- nested objects/arrays inside can still be modified.
const frozen = Object.freeze(["Apple", "Banana", "Cherry"]);
// These silently fail (or throw in strict mode)
frozen.push("Date"); // TypeError in strict mode
console.log("After push attempt:", frozen);
frozen[0] = "Mango"; // silently fails
console.log("After change attempt:", frozen);
// Check if frozen
console.log("Is frozen:", Object.isFrozen(frozen));
// WARNING: freeze is shallow!
const nested = Object.freeze([[1, 2], [3, 4]]);
nested[0].push(99); // This WORKS!
console.log("Nested modified:", nested);Best Practices
Modern JavaScript style guides recommend using const by default for arrays. Only use let when you need to reassign the variable. Here are the best practices for working with const arrays.
// GOOD: use const for arrays you won't reassign
const items = [1, 2, 3];
items.push(4);
console.log("const array:", items);
// GOOD: use non-mutating methods to create new arrays
const original = [3, 1, 4, 1, 5];
const sorted = [...original].sort((a, b) => a - b);
console.log("Original:", original);
console.log("Sorted copy:", sorted);
// GOOD: use spread to avoid mutation
const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];
console.log("arr1:", arr1);
console.log("arr2:", arr2);
// GOOD: use map/filter instead of mutating
const numbers = [1, 2, 3, 4, 5];
const evens = numbers.filter(n => n % 2 === 0);
console.log("Evens:", evens);Const vs Let vs Var for Arrays
Understanding when to use each declaration keyword for arrays is important for writing clean, predictable code.
| Keyword | Reassign? | Mutate? | Scope | Recommendation |
|---|---|---|---|---|
| const | No | Yes | Block | Default choice for arrays |
| let | Yes | Yes | Block | Only if you need to reassign |
| var | Yes | Yes | Function | Avoid -- use const or let |
// Use let when you need to reassign
let results = [];
for (let i = 0; i < 3; i++) {
results = [...results, i * 10];
}
console.log("Results:", results);
// Or when swapping arrays
let a = [1, 2, 3];
let b = [4, 5, 6];
[a, b] = [b, a];
console.log("a:", a);
console.log("b:", b);