'How to remember if a method mutates the original array?

I know I can find a list of mutator methods on MDN, still, in practice I always forget if methods like push() or reverse() mutates the original array or creates a new one. Is there a logic to why certain methods are mutators and some are non-mutators, so I can easily remember?



Solution 1:[1]

Maybe a helpful way to remember them is to identify the mutating methods and group them; there's only a small amount.

Add/remove from array:

  • Array.prototype.fill() - overwrite elements anywhere
  • Array.prototype.pop() - remove from right
  • Array.prototype.push() - add to right
  • Array.prototype.shift() - remove from left
  • Array.prototype.unshift() - add to left
  • Array.prototype.splice() - add/remove anywhere

Rearrange arrays:

  • Array.prototype.sort() - rearrange elements using a sorting function
  • Array.prototype.reverse() - reverse elements

Oddball:

  • Array.prototype.copyWithin() - honestly, I've never used this method

List of mutating array methods

  • Array.prototype.copyWithin()
  • Array.prototype.fill()
  • Array.prototype.flat()
  • Array.prototype.pop()
  • Array.prototype.push()
  • Array.prototype.reverse()
  • Array.prototype.shift()
  • Array.prototype.sort()
  • Array.prototype.splice()
  • Array.prototype.unshift()

List of non-mutating array methods

  • Array.from() - create an array from an iterable
  • Array.isArray() - check if a variable is an array
  • Array.of() - create an array; function version of []
  • Array.prototype.concat() - combine several arrays into a new single array
  • Array.prototype.entries() - get iterator of key/value pairs
  • Array.prototype.every() - check if every value matches a function
  • Array.prototype.filter() - create an array of values matching a filter
  • Array.prototype.find() - find a value using a function
  • Array.prototype.findIndex() - find the index of a value using a function
  • Array.prototype.flat() - flatten a nested array
  • Array.prototype.flatMap() - create an new array using a mapping function
  • Array.prototype.forEach() - run a side effect for each value
  • Array.prototype.includes() - check if the array includes a value
  • Array.prototype.indexOf() - find the index of a value by value
  • Array.prototype.join() - combine values into a string using a separator
  • Array.prototype.keys() - get iterator of keys
  • Array.prototype.lastIndexOf() - find the index of a value by value, starting at the end
  • Array.prototype.map() - create a new array using a mapping function
  • Array.prototype.reduce() - fold over each value, producing a new value
  • Array.prototype.reduceRight() - fold over each value, starting from the right, producing a new value
  • Array.prototype.slice() - select a subarray
  • Array.prototype.some() - check if some value matches a function
  • Array.prototype.toLocaleString() - string representation of the array, uses toLocaleString on values
  • Array.prototype.toString() - string representation of the array, uses toString on values
  • Array.prototype.values() - get iterator of values
  • Array.prototype[@@iterator]() - get default iterator

Solution 2:[2]

Any method that causes the indices to shift, diminish or grow, or otherwise changes the original definition of the list, by nature, must be mutable. A mnemonic might be to consider if you want something from the array or want to do something to the array? Shift and pop are arguably confusing because they don't really have an equivalent immutable convenience method like say 'top' or 'last'.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 4m1r