The Ultimate JavaScript Array Cheat Sheet

The Most Comprehensive JavaScript Array Methods Cheat Sheet

Looking for the ultimate JS array cheat sheet to solidify your understanding of arrays? We got you covered!

What is an array in JavaScript?

In JavaScript, an array is a fundamental data structure used to store multiple values in an ordered list. Learning about arrays is crucial for web development, as they help in managing and manipulating data efficiently.

Declaring Arrays in JavaScript

The most common way to declare an array in JavaScript is to use the [] syntax.

const numbers = [1, 2, 3, 4, 5];

const fruits = ['apple', 'banana', 'cherry'];

Common JavaScript Array Methods

JavaScript provides various built-in methods for manipulating arrays. Mastering these will help you in JavaScript programming classes and real-world projects.

Adding & Removing Elements

• push() – Adds elements to the end.
• pop() – Removes the last element.
• unshift() – Adds elements to the beginning.
• shift() – Removes the first element.

const arr = [1, 2, 3];

arr.push(4); // [1, 2, 3, 4]
arr.pop(); // [1, 2, 3]
arr.unshift(0); // [0, 1, 2, 3]
arr.shift(); // [1, 2, 3]

Iterating Over Arrays

• forEach() – Loops through each item.
• map() – Creates a new array by applying a function to each element. Read more about map.
• filter() – Returns a new array with elements that meet a condition. Read more about filter.
• reduce() – Reduces an array to a single value. Read more about reduce.

const numbers = [1, 2, 3, 4, 5];

numbers.forEach(num => console.log(num));

const doubled = numbers.map(num => num * 2);

const evens = numbers.filter(num => num % 2 === 0);

const sum = numbers.reduce((acc, num) => acc + num, 0);

Searching & Transforming

• find() – Finds the first matching element.
• some() – Checks if at least one element meets a condition.
• every() – Checks if all elements meet a condition.
• indexOf() – Finds the index of an element.
• includes() – Checks if an element exists.

const nums = [10, 20, 30, 40];

console.log(nums.find(n => n > 25)); // 30

console.log(nums.includes(20)); // true

console.log(nums.indexOf(30)); // 2

Sorting & Reversing

• sort() – Sorts an array (modifies the original array).
• reverse() – Reverses the array order.
• toSorted() (ES2023) – Returns a sorted copy without modifying the original.

const scores = [40, 10, 100, 50];

scores.sort((a, b) => a - b); // [10, 40, 50, 100]

Removing Duplicates

const uniqueNumbers = [...new Set([1, 2, 2, 3, 4, 4, 5])]; // [1, 2, 3, 4, 5]

JavaScript Performance Tips

Optimizing your JavaScript code can improve efficiency, especially in web applications and server-side development.

1. Use push() instead of unshift() – push() is faster since it avoids shifting indexes.
2. Use Set for unique values – More efficient than filtering duplicates manually.
3. Use map() and reduce() wisely – map() creates a new array, while forEach() modifies in place.
4. Sort with compare functions – Default sort() converts values to strings, causing incorrect ordering.

JavaScript Array Interview Questions

In your first job interview, 9/10 times you will be asked about arrays. Here are some practice questions to help you prepare for your next interview:

1. Reverse an array in place – without using .reverse().
2. Find the missing number in a sequence.
3. Implement a custom map function that mimics Array.prototype.map.
4. Rotate an array by k positions.
5. Find the most frequent element in an array.

Additional JavaScript Resources to Learn Arrays

Looking for the best sites to learn JavaScript, or some free JavaScript resources? Check these out these free resources on javascript arrays:

• TechBlitz Array.some()
• TechBlitz Array.map()
• TechBlitz Array.filter()
• TechBlitz Array.reduce()

Where to Learn JavaScript for Free

Are you wanting a free, fun way to learn JS arrays? Head over to TechBlitz, sign up for a free account and start learning!