Do these 3 things before closing this tab:
1Fix the driver behind crashes, sound loss and screen glitches2Repair Windows errors before they cause bigger problems3Scan for outdated or missing drivers - takes under a minuteA JavaScript array stores an ordered collection of values. Create one with square brackets, use zero-based indexes to read or change its items, and choose methods such as push(), map(), and filter() for common tasks.
How do I create an array in JavaScript?
For a typical array, write comma-separated values inside square brackets:
As an Amazon Associate I earn from qualifying purchases.
const colors = ["red", "green", "blue"];This creates an Array object with three ordered elements. Arrays can hold strings, numbers, objects, or other arrays, and they can grow or shrink. When learning, keep values consistent—for example, a list of colors or scores—so the operations are easier to follow. See MDN’s guide to indexed collections.
PC Slower Than It Used to Be?
A free scan shows the junk files, broken settings and background clutter dragging Windows down - then fixes them in one click.Free scan · Windows 10 & 11Crashes, No Sound, or Screen Glitches?
Random freezes, missing sound and display glitches usually trace back to one bad driver. Find and replace yours safely.Free scan · under a minuteHow do I get or change an item?
Array positions are called indexes, and counting starts at zero. In colors, the first item is at index 0, the second at 1, and the third at 2.
#1 Best Overall
console.log(colors[0]); // "red"
colors[0] = "purple";
console.log(colors[0]); // "purple"Reading an index that has no element returns undefined rather than throwing an error:
console.log(colors[3]); // undefinedMDN’s JavaScript language overview explains array access and common operations.
What does an array’s length mean?
Use the length property to check an array’s indexed extent:
Rank #2
console.log(colors.length); // 3For a dense array like this one, length is the number of elements. More exactly, it is one greater than the highest array index. That distinction matters for sparse arrays—arrays with empty slots. Increasing an array’s length creates empty slots; it does not fill them with actual undefined values. Empty slots and elements explicitly set to undefined are different, and some methods treat them differently. Beginners usually do not need to create sparse arrays deliberately.
How do I add or remove items?
push() adds one or more items at the end of the existing array. pop() removes and returns its last item. Both change the original array.
const shopping = ["bread", "apples"];
shopping.push("tea");
console.log(shopping); // ["bread", "apples", "tea"]
const removed = shopping.pop();
console.log(removed); // "tea"
console.log(shopping); // ["bread", "apples"]These methods are convenient when you want to work at the end of a list. MDN’s Array reference documents them alongside other array methods.
Which method should I use: map, filter, find, or includes?
Use map() to transform every item
map() calls a function for each element and returns a new array containing the callback results. It does not replace the original array.
const prices = [2, 5, 8];
const doubled = prices.map(price => price * 2);
console.log(doubled); // [4, 10, 16]
console.log(prices); // [2, 5, 8]Use filter() to keep items that pass a test
filter() returns a new array containing the elements for which its callback returns a truthy result.
const scores = [42, 75, 90, 58];
const passing = scores.filter(score => score >= 60);
console.log(passing); // [75, 90]Use find() or includes() to check for a match
find() returns the first matching element, or undefined if none matches. includes() checks whether an array contains a particular value and returns true or false.
Rank #4
const colors = ["red", "green", "blue"];
const firstLongColor = colors.find(color => color.length > 4);
console.log(firstLongColor); // "green"
console.log(colors.includes("blue")); // trueWhat is the difference between map() and forEach()?
Choose map() when you need a new array of results. Choose forEach() to run an action for each element, such as printing it or updating another value; its useful result is not a transformed array.
const upperColors = colors.map(color => color.toUpperCase());
colors.forEach(color => console.log(color));MDN’s Array documentation describes the behavior of these methods.
The Tool Desk
Outbyte Driver Updater FREEFix the driver behind crashes, sound loss and screen glitchesFind Drivers →Outbyte PC Repair FREERepair Windows errors before they cause bigger problemsFix Now →How do I go through every item?
Use a for...of loop when you want to perform an action for each value without needing its index:
for (const color of colors) {
console.log(color);
}Use a traditional for loop when the index is useful—for example, if you need to display a numbered item:
for (let index = 0; index < colors.length; index++) {
console.log(index, colors[index]);
}Both approaches visit the array in order. MDN’s language overview demonstrates array iteration.
Are arrays associative arrays?
No. Use nonnegative integer indexes to access array elements, not arbitrary string keys. As MDN puts it, “JavaScript arrays are not associative arrays and so, array elements cannot be accessed using arbitrary strings as indexes, but must be accessed using nonnegative integers (or their respective string form) as indexes.” See the MDN Array reference. If you need key/value lookup, an object or Map is generally a better fit than treating an array as a string-keyed collection.
Where can I learn more?
MDN’s free online guides and reference are useful for examples and looking up behavior as you learn. For a more guided print introduction, Nick Morgan’s JavaScript for Kids includes a dedicated chapter on arrays and practice challenges. The publisher presents it especially for children and parents, as well as beginners more broadly. It covers JavaScript beyond arrays, so it is an optional learning route, not a prerequisite. See the publisher’s book page.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
