Nearby lessons
34 of 40๐น JavaScript Array Methods
๐ What are Array Methods?
JavaScript provides powerful built-in methods to manipulate arrays efficiently.
These methods help with adding, removing, transforming, searching, and iterating through array elements.
๐ธ Mutator Methods (Modify Original Array)
| Attribute | Description |
|---|---|
push() | ๐ Adds one or more elements to the end |
pop() | ๐ Removes the last element |
shift() | ๐ Removes the first element |
unshift() | ๐ Adds one or more elements to the beginning |
splice() | ๐ Adds/Removes elements at specific index |
reverse() | ๐ Reverses the order of elements |
sort() | ๐ Sorts the array alphabetically/numerically |
fill() | ๐ Fills array with static value |
๐ธ push() : Adds one or more elements to the end
๐ The push() method adds new items to the end of an array.
๐ The push() method changes the length of the array.
๐ The push() method returns the new length.
Syntax: array.push(item1, item2, ..., itemX)
Code Example
๐ธ pop() : Removes the last element
๐ The pop() method removes (pops) the last element of an array.
๐ The pop() method changes the original array.
๐ The pop() method returns the removed element.
Syntax: array.pop()
Code Example
๐ธ shift() : Removes the first element
๐ The shift() method removes the first element from an array.
๐ It changes the original array and returns the removed element.
Syntax: array.shift()
Code Example
๐ธ unshift() : Adds one or more elements to the beginning
๐ The unshift() method adds one or more elements to the beginning of an array.
๐ It returns the new length of the array.
Syntax: array.unshift(item1, item2, ..., itemX)
Code Example
๐ธ splice() : Adds/Removes elements at specific index
๐ The splice() method can be used to add or remove elements at a specified index.
๐ It modifies the original array and returns the removed items.
Syntax: array.splice(start, deleteCount, item1, ..., itemX)
Code Example
๐ธ reverse() : Reverses the order of elements
๐ The reverse() method reverses the order of the elements in an array.
๐ It modifies the original array.
Syntax: array.reverse()
Code Example
๐ธ sort() : Sorts the array alphabetically/numerically
๐ The sort() method sorts the elements of an array.
๐ By default, it sorts alphabetically. For numbers, a compare function is needed.
Syntax: array.sort() or array.sort(compareFunction)
Code Example
๐ธ fill() : Fills array with static value
๐ The fill() method fills elements in an array with a static value.
๐ It changes the original array.
Syntax: array.fill(value, start, end)
Code Example
๐ธ Non-Mutator Methods (Do Not Modify Original Array)
| Attribute | Description |
|---|---|
concat() | ๐ Merges arrays |
join() | ๐งฉ Joins elements as a string |
slice() | โ๏ธ Extracts a section into a new array |
includes() | ๐ Checks if value exists |
indexOf() | ๐ Finds first index of element |
lastIndexOf() | ๐ Finds last index of element |
toString() | ๐ค Converts array to string |
๐ธ concat() : Merges arrays
๐ The concat() method is used to merge two or more arrays.
๐ It returns a new array without changing the existing arrays.
Syntax: array1.concat(array2, array3, ..., arrayX)
Code Example
๐ธ join() : Joins elements as a string
๐ The join() method joins all array elements into a single string.
๐ You can specify a separator (like comma, space, dash, etc).
Syntax: array.join(separator)
Code Example
๐ธ slice() : Extracts a section into a new array
๐ The slice() method returns a shallow copy of a portion of an array.
๐ It does not modify the original array.
Syntax: array.slice(start, end)
Code Example
๐ธ includes() : Checks if value exists
๐ The includes() method checks if an array contains a certain value.
๐ It returns true or false.
Syntax: array.includes(element, start)
Code Example
๐ธ indexOf() : Finds first index of element
๐ The indexOf() method returns the first index of the element in the array.
๐ Returns -1 if not found.
Syntax: array.indexOf(element, start)
Code Example
๐ธ lastIndexOf() : Finds last index of element
๐ The lastIndexOf() method returns the last index of the element in the array.
๐ Returns -1 if not found.
Syntax: array.lastIndexOf(element, start)
Code Example
๐ธ toString() : Converts array to string
๐ The toString() method converts an array to a comma-separated string.
๐ It does not modify the original array.
Syntax: array.toString()
Code Example
๐ธ Iteration Methods (Used for Looping)
| Attribute | Description |
|---|---|
forEach() | ๐ Executes a function for each element |
map() | ๐บ๏ธ Transforms each element into new array |
filter() | ๐ฟ Filters elements based on condition |
reduce() | โ Reduces array to single value |
some() | โ๏ธ Returns true if any element passes test |
every() | โ Returns true if all elements pass test |
find() | ๐ Returns first match |
findIndex() | ๐ข Returns index of first match |
๐ธ forEach() : Executes a function for each element
๐ The forEach() method calls a function once for each array element.
๐ It does not return a new array.
Syntax: array.forEach(callback)
Code Example
๐ธ map() : Transforms each element into new array
๐ The map() method creates a new array with the results of calling a function on every element.
Syntax: array.map(callback)
Code Example
๐ธ filter() : Filters elements based on condition
๐ The filter() method creates a new array with all elements that pass the test implemented by the function.
Syntax: array.filter(callback)
Code Example
๐ธ reduce() : Reduces array to single value
๐ The reduce() method executes a reducer function on each element and returns a single output value.
Syntax: array.reduce(callback, initialValue)
Code Example
๐ธ some() : Returns true if any element passes test
๐ The some() method tests whether at least one element in the array passes the test function.
Syntax: array.some(callback)
Code Example
๐ธ every() : Returns true if all elements pass test
๐ The every() method checks if all elements in the array pass the test function.
Syntax: array.every(callback)
Code Example
๐ธ find() : Returns first match
๐ The find() method returns the first element that satisfies the provided testing function.
Syntax: array.find(callback)
Code Example
๐ธ findIndex() : Returns index of first match
๐ The findIndex() method returns the index of the first element that satisfies the testing function.
Syntax: array.findIndex(callback)