MichiPedia

Überblick

# MUTATE array                NEW array            INDEX            ELEMENT

.push()                       .map()               .indexOf()       .find()
.unshift()                    .filter()            .findIndex()
                              .slice()
.pop()                        .concat()            
.shift()                      .flat()
.splice()                     .flatMap()

.reverse()
.sort()
.fill()

# Includes                     String               TRANSFORM        LOOP

.includes()                    .join()              .reduce()       .forEach()
.some()
.every()

Simple Array Methods

const array = ['a', 'b', 'c', 'd', 'e'];

# does NOT mutate array

array.slice(start[, end]);                           # end not included
array.slice(1);                                      # ['b', 'c', 'd', 'e']

array1.concat(array2)
array.join(' - ')                                    # 'a - b - c - d - e'
array.at()                                           # use array.at(-1) instead of
                                                     # array[array.length - 1] or
                                                     # array.slice(-1)[0]

# mutate original array

array.splice(start[, deleteCount[, item1, item2, itemN]])
                                                    # itemX will be added
array.reverse()

Methods with Callback Functions

array.forEach()

array.forEach(function(el [, index, arr]) {})        # continue & break DON'T work
map.forEach(function(value, [key, map]) {})
set.forEach(function(value, [key, set]) {})          # key always same as value

array.map()

# creates new array
#
# orgArray = [1, 2, 3] ==> newArray = [2, 4, 6]
#
array.map(function( el [, index [, array ]] ) {
   ...
   return value;          // !!
});

array.filter()

# creates new array
#
# orgArray = [1, 2, 3] ==> newArray = [2, 3]
#
array.filter(function( el [, index [, array ]] ) {
   /* filter conditions */
   return value;          // !!
});

array.reduce()

# breaks array down to ONE value (accumulator)
# acc + currElement
#
# orgArray = [1, 2, 3] ==> value = 2
#
array.reduce(function (acc, el[, index[, arr]]) {
  /* cumulate values to acc */
  return acc;
}, 0);

array.find()

# returns first value that meets condition
#
# array = [1, 2, 3] ==> value = 2 
#
array.find(function (el[, index[, arr]]) {
  /* check if condition is true */
  return el;
});

array.findIndex()

# returns array index that meets condition
#
# array = [1, 2, 3] ==> true/false 
#
array.find(function (el[, index[, arr]]) {
  /* check if condition is true */
  return index;
});

array.some()

# returns boolean value if at least one value meets condition
# and terminates array traversal as soon as element has been found (true)
#
# array = [1, 2, 3] ==> true/false 
#
array.some(function (el[, index[, arr]]) {
  /* check if condition is true */
  return boolean;
});

array.every()

# returns true if all values meet condition otherwise false
# and terminates array traversal after first "false"
#
# array = [1, 2, 3] ==> true/false 
#
array.some(function (el[, index[, arr]]) {
  /* check if condition is true */
  return boolean;
});

array.flat()

# returns a flattened array by 1 level
#
# array.flat() = [[[1, 2], 3], [4, 5], 6] ==> [[1, 2], 3, 4, 5, 6] 
# array.flat(2) = [[[1, 2], 3], [4, 5], 6] ==> [1, 2, 3, 4, 5, 6]

array.flat( null / depth);

array.flatMap()

# combines an array.map() with a following array.flat() call
#
# only goes 1 level deep !!
#

array.flatMap((function (el[, index[, arr]]) {
  /* so something */
  return flattened array;
});

array.sort()

# mutates array !
#
# with no argumants sorts numbers in array as "Strings"
#        [ 70, 8, -170 ] ==> [ -170, 70, 8 ]

array.sort() {
}

# a = current value, b = next value
# does not work when numbers and/or strings are mixed

movements.sort((a, b) => {
  // if (a > b) return 1;
  // else return -1;
  return a - b;
});

Array.from()

# needs object and callback function
# callback function works same as in map()

Array.from({ length: 7 }, (_, i) => i + 1);