JavaScript Data Collections

Ordered collections for storing, accessing, transforming, and working with groups of values.

Term / Syntax	Name	Description	Example
[]	Array	Stores an ordered collection of values.	const skills = ["HTML", "CSS", "JavaScript"];
Array.from()	Create Array	Creates a new array from an iterable or array-like value.	const cards = Array.from(elements);
array.length	Array Length	Returns the number of items in an array.	skills.length;
array[index]	Array Item Access	Reads or updates an array item at a zero-based index.	skills[0];
destructuring	Extract Array Values	Extracts array values into variables by their position.	const [first, second] = skills;
spread	Copy/Expand Array	Expands array values into another array or iterable context.	const copiedSkills = [...skills];
.with()	Non-Mutating Item Replacement	Returns a new array with the item at a specified index replaced without changing the original array.	const updatedSkills = skills.with(0, "HTML5");
.push()	Add Array Item	Adds one or more items to the end of an array and mutates the original array.	skills.push("Vue");
.pop()	Remove Last Item	Removes and returns the last array item and mutates the original array.	const lastSkill = skills.pop();
.unshift()	Add First Item	Adds one or more items to the beginning of an array and mutates the original array.	skills.unshift("Git");
.shift()	Remove First Item	Removes and returns the first array item and mutates the original array.	const firstSkill = skills.shift();
.slice()	Copy Array Portion	Returns a shallow copy of part of an array without changing the original array.	const firstThree = items.slice(0, 3);
.concat()	Combine Arrays	Returns a new array by combining values without changing the original arrays.	const allSkills = frontend.concat(backend);
.flat()	Flatten Array	Returns a new array with nested arrays flattened to a specified depth.	nested.flat();
.splice()	Change Array Items	Adds, removes, or replaces items and mutates the original array.	items.splice(1, 1);
.toSpliced()	Non-Mutating Splice	Returns a new array with items added, removed, or replaced without changing the original array.	const updatedItems = items.toSpliced(1, 1);
.sort()	Sort Array	Sorts array items in place and mutates the original array.	names.sort();
.toSorted()	Non-Mutating Sort	Returns a new sorted array without changing the original array.	const sortedNames = names.toSorted();
.reverse()	Reverse Array	Reverses array items in place and mutates the original array.	skills.reverse();
.toReversed()	Non-Mutating Reverse	Returns a new reversed array without changing the original array.	const reversedSkills = skills.toReversed();
.fill()	Fill Array	Replaces array items with a value and mutates the original array.	scores.fill(0);
.join()	Join Array Items	Combines array items into a string using an optional separator.	skills.join(", ");
.forEach()	Array Iteration	Calls a function once for each item in an array.	items.forEach(item => console.log(item));
.map()	Array Mapping	Creates a new array by transforming each item.	const names = users.map(user => user.name);
.filter()	Array Filtering	Creates a new array containing matching items.	const active = users.filter(user => user.active);
.includes()	Value Check	Checks whether an array contains a specified value.	skills.includes("JavaScript"); // true
.indexOf()	Value Index	Returns the index of the first matching value, or -1 if the value is not found.	skills.indexOf("JavaScript");
.some()	Condition Check	Checks whether at least one array item matches a condition.	users.some(user => user.active);
.every()	All Items Check	Checks whether every array item matches a condition.	users.every(user => user.active);
.find()	Find Item	Returns the first array item matching a condition.	const admin = users.find(user => user.role === "admin");
.findLast()	Find Last Item	Returns the last array item matching a condition.	const latestAdmin = users.findLast(user => user.role === "admin");
.reduce()	Reduce Collection	Combines array values into one accumulated result.	const total = prices.reduce((sum, price) => sum + price, 0);

Key/value structures for storing, accessing, and working with related data.

Term / Syntax	Name	Description	Example
{}	Object	Stores key/value properties.	const user = { name: "Jennifer", role: "Developer" };
object.property	Property Access	Reads or updates an object property by its name.	user.name
object[property]	Dynamic Property Access	Reads or updates an object property using a property name or expression.	user[propertyName]
Object.keys()	Object Property Names	Returns an array containing an object's own enumerable property names.	Object.keys(user);
Object.values()	Object Property Values	Returns an array containing an object's own enumerable property values.	Object.values(user);
Object.entries()	Object Property Entries	Returns an array containing an object's own enumerable key/value pairs.	Object.entries(user);
Object.fromEntries()	Create Object from Entries	Creates an object from an iterable containing key/value pairs.	const user = Object.fromEntries(entries);
Object.hasOwn()	Own Property Check	Checks whether an object has a specified property as its own property.	Object.hasOwn(user, "role"); // true
delete	Remove Property	Removes a property from an object and mutates the original object.	delete user.active;
Object.freeze()	Prevent Object Changes	Prevents properties from being added, removed, or changed on an object.	Object.freeze(settings);
destructuring	Extract Values	Extracts object properties into variables.	const { name, role } = user;
spread	Copy/Merge Syntax	Expands object properties into another object.	const updated = { ...user, active: true };
structuredClone()	Deep Clone	Creates a deep clone of a supported value, including nested objects and arrays.	const copy = structuredClone(user);

Keyed collections for storing and working with key/value pairs.

Term / Syntax	Name	Description	Example
Map	Keyed Collection	Stores key/value pairs and allows values of any type, including objects, to be used as keys.	const users = new Map();
.set()	Add or Update Map Entry	Adds a key/value pair to a Map or updates the value for an existing key.	users.set(1, "Jennifer");
.get()	Get Map Value	Returns the value associated with a specified Map key, or undefined if the key is not found.	const user = users.get(1);
.has()	Map Key Check	Checks whether a Map contains a specified key.	users.has(1); // true
.delete()	Remove Map Entry	Removes an entry by its key and returns whether the entry existed.	users.delete(1); // true
.size	Map Size	Returns the number of entries in a Map.	users.size;

Unique-value collections for storing and working with values without duplicates.

Term / Syntax	Name	Description	Example
Set	Unique Value Collection	Stores a collection of unique values without allowing duplicates.	const skills = new Set(["HTML", "CSS", "JavaScript"]);
.add()	Add Set Value	Adds a value to a Set if that value is not already present.	skills.add("Vue");
.has()	Set Value Check	Checks whether a Set contains a specified value.	skills.has("JavaScript"); // true
.delete()	Remove Set Value	Removes a specified value from a Set and returns whether the value existed.	skills.delete("CSS"); // true
.size	Set Size	Returns the number of values in a Set.	skills.size;