javascriptの配列の関数を並べてみました。

殆どMDNからのパクリです。
なんとなくforEachで片付けてしまうところとかもあるし、必要に応じて使い分ければ冗長なコードを書かなくて済むし
なんとなく使いこなせたらかっこいい気がするｗ
ので、並べてみました。分からなかったらMDNや他のサイトに飛んでください。

足りないものがあれば追記していく予定です。

concat
配列と配列を結合する。
戻り：配列インスタンス
配列以外の値を引数に指定した場合、末端にappendされる。
引数に何も指定してなければ、新しい配列がコピーされる。

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    const concat = arr.concat(['d', 'e']);
    // concat: ['a', 'b', 'c', 'ab', 'bc', 'd', 'e']
    const concat2 = arr.concat('d');
    // concat2: ['a', 'b', 'c', 'ab', 'bc', 'd']
    const concat3 = arr.concat();
    // concat3: ['a', 'b', 'c', 'ab', 'bc']

every
引数に渡されたcallback関数を実行。
callback内でfalseがｌ返されたらその時点でループは終了。戻りはfalseとなる。
ループ終了後、falseがなければ戻りはtrueとなる。

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    const every = arr.every((val) => {
      return typeof val === 'string';
    });
    //  every: true;
    const every2 = ['a', 'b', 'c', 'ab', 1, 'bc'].every((val) => {
      return typeof val === 'string';
    });
    //  every2: false;

filter
引数に渡されたcallback関数を実行。
戻り：条件に一致する配列の要素を返却し、新しい配列を作成する。

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    const filter = arr.filter((val) => {
      return val.indexOf('a') !== -1;
    });
    //  filter: ['a', 'ab'];

forEach
callBackの関数を順番に実行する。
戻りはvoid;

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    let forEach = '';
    arr.forEach((val, i) => {
      forEach += val;
      forEach += (i !== arr.length - 1) ?
        'と' : '';
    });
    //  forEach: aとbとcとabとbc

indexOf
配列の要素の中から完全一致するものを探す。
戻りは要素の最初の添字(位置)存在しない場合は-1

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    const indexOf = arr.indexOf('ab');
    //  indexOf : 3

join
配列と配列を結合して文字列に返却。
対象の配列が空の場合は空文字を返却

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    const join = [].join();
    //  join : '' //空文字

    const join2 = [].join(',');
    //  join2 : '' //空文字

    const join3 = arr.join();
    //  join3: a,b,c,ab,bc

    const join4 = arr.join('と');
    //  join4: aとbとcとabとbc

lastIndexOf
配列の要素の中から完全一致するものを探す。
戻りは要素の添字(位置)存在しない場合は-1
indexOfとの違いは見つかった最後の添字という点。

    const arr = ['a', 'b', 'b', 'c'];
    const lastIndexOf = arr.lastIndexOf('b');
    //  lastIndexOf : 2

    //  ちなみにindexOfでは
    const indexOf = arr.indexOf('b');
    //  indexOf : 1;

map
全ての配列要素に対し処理をし、その結果新しい配列の結果を返却する。
forEachだと冗長な処理になりがちだが、これを使用するとスッキリかけることがある。

    const numArr = [2, 3, 4, 5];
    const map = numArr.map((val) => {
      return val * 2;
    });
    //  map : [4, 6, 8, 10];

pop
配列から最後の要素を取り出し、取り出した要素を戻りとして返却する。
もし配列が空だった場合、戻りはundefinedになる。

    const arr = ['japan', 'america', 'rusia'];
    const pop = arr.pop();
    //  arr: ['japan', 'america'] // 末端の要素が取り出されて配列数が1減る。
    //  pop: 'rusia'

push
配列に要素を追加する。戻りは追加後の配列数。

    const arr = ['japan', 'america', 'rusia'];
    const push = arr.push('germany');
    //  push : 4
    //  arr: ['japan', 'america', 'rusia', 'germany']

reduce
アキュムレータと配列の各要素に対して（左から右へ）関数を適用し、単一の値にする。
ちょっと理解ができないので、実際に書いてみる。

    const numArr = [2, 3, 4, 5];
    const reduce = numArr.reduce((preVal, crrVal, index) => {
      console.log(`${index}: preval:${preVal} crrVal:${crrVal}`);
      return preVal + crrVal;
    });
    //  1: preval:2 crrVal:3
    //  2: preval:5 crrVal:4
    //  3: preval:9 crrVal:5
    //  reduce: 14

まずpreviousValueとcurrentValueを使用して処理を実施して、
その結果がpreValに代入されている。
crrValは前回のcrrValの次の要素・・・。ということでいいのか？
なんとなくわかったような。そうではないような。。。
と思ったけど、こんな使い方なら良さそう。

    //  二次元配列を一次元配列にする
    const associativeArray = [['a', 'b'], ['c', 'd'], ['e', 'f']];
    const reduce2 = associativeArray.reduce((preArr, crrArr) => {
      return preArr.concat(crrArr);
    });
    //  reduce2: ['a', 'b', 'c', 'd', 'e', 'f']

reduceRight
reduceとは逆で右から左へと処理の順番が異なる。それ以外は同じ。

    const associativeArray = [['a', 'b'], ['c', 'd'], ['e', 'f']];
    const reduceRight = associativeArray.reduceRight((preArr, crrArr) => {
      return preArr.concat(crrArr);
    });
    //  reduceRight: ['e', 'f', 'c', 'd', 'a', 'b']

reverse
配列を逆さまにする。最初の配列要素が最後、最後の要素が最初。という感じ。
また、新しい配列インスタンスは作らないので、元の配列の順序も変わります。

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    const reverseArr = arr.reverse();
    //  arr: ['bc', 'ab', 'c', 'b', 'a']

shift
配列の最初の要素(0番目)を取り除き、取り除かれたあとの配列の要素の添字は1マイナスになる。
popの反対というイメージ。

    const arr = ['japan', 'america', 'rusia'];
    const shift = arr.shift();
    //  arr: ['america', 'rusia']
    //  shift: 'japan'

slice
配列の一部を取り出して新しい配列を作成。
配列のシャローコピーも可能。

    const arr = ['japan', 'america', 'rusia', 'germany', 'france'];
    //  begin・・・取り出す位置
    //  end・・・どこまで取り出すかを決めた位置

    //  slice(1, 3) は1番目の要素から4番目の要素まで
    //  (添字が 1, 2, の要素) を取り出します。
    const slice = arr.slice(1, 3);
    //  slice: ['america', 'rusia']
    //	arr: ['japan', 'america', 'rusia', 'germany', 'france'];
    //  元の配列に変更は加えないので、arrは変わることはない。

シャローコピーの実施と確認

    const arr = ['japan', 'america', 'rusia', 'germany', 'france'];
    const slice = arr.slice();
    
    //  配列の要素内の比較
    const result = JSON.stringify(arr) === JSON.stringify(slice);
    console.log(result); // true
    
    //  きちんと値渡しになっているかを確認
    slice[0] = 'finland';
    const result2 = JSON.stringify(arr) === JSON.stringify(slice);
    console.log(result2); // false

sort
配列を並び替えする。

    const arr = ['japan', 'america', 'rusia'];
    arr.sort();
    //  sortArr: ['america', 'japan', 'rusia']
    
    const numArr = [2, 10, 3, 100];
    numArr.sort();
    //  numArr: [10, 100, 2, 3]

どうやら数字も文字列としてみているような挙動なので、
数字のソートはcallbackで対応する。

    // callBackでaとbを比較してあげるだけで簡単にソートできる。
    const numArr = [2, 10, 3, 100];
    numArr.sort((a, b) => {
      return a - b;
    });
    //  numArr: [2, 3, 10, 100]
    //  a - bをb - aにすると降順になる。

some
引数に渡されたcallback関数を実行。
callback内でtrueがｌ返されたらその時点でループは終了。戻りはtrueとなる。
ループ終了後、trueがなければ戻りはfalseとなる。

    const arr = ['a', 'b', 'c', 'ab', 'bc'];
    const some = arr.some((val) => {
      return typeof val === 'number';
    });
    //  some: false;
    const some2 = arr.some((val) => {
      return typeof val === 'string';
    });
    //  some2: true;

splice
説明が厄介な関数。
古い要素を取り除きつつ新しい要素を追加することで、
配列の内容を変更します。
とMDNには記載があるが分かりづらいのでソースに落とし込みます。

spliceの引数は3つ
array.splice(index, howMany, [element1][, ..., elementN]);

index: 配列を変化させ始める要素の添字。arr.lengthより大きい場合、arr.lengthと同じ値
値が負数の場合、配列の終端からその値を引いた数が開始位置となる。

howMany: 配列から取り除く要素の数を示す。0の場合は取り除かれない。
引数無しの場合、index以降の全ての要素が取り除かれる。

element1, ...elementN
追加する要素。要素指定がなければ配列から要素を取り除く

戻りは取り除かれた配列。何も取り除かれなかった場合、空配列が返却される。

    // 空の配列を返却。
    const arr = ['japan', 'america', 'rusia'];
    const splice = arr.splice();
    //  splice: []
    //  arr: ['japan', 'america', 'rusia']

    // 2番目以降の配列を全て取り除く
    const arr = ['japan', 'america', 'rusia'];
    const splice = arr.splice(1);
    //  splice: ['america', 'rusia']
    //  arr: ['japan']

    //  2番目(index)の位置に0個(howMany)取り除き、germany(elem)を追加する。
    const arr = ['japan', 'america', 'rusia'];
    const splice = arr.splice(1, 0, 'germany');
    //  splice: []  // 何も取り除かれていない。
    //  arr: ['japan', 'germany', america', 'rusia']

    //  2番目(index)の位置に1個(howMany)取り除く。
    const arr = ['japan', 'america', 'rusia'];
    const splice = arr.splice(1, 1);
    //  splice: ['america']
    //  arr: ['japan', 'rusia']

    //  2番目(index)の位置に1個(howMany)取り除き、germany(elem)を追加する。
    const arr = ['japan', 'america', 'rusia'];
    const splice = arr.splice(1, 1, 'germany');
    //  splice: ['america']
    //  arr: ['japan', 'germany', 'rusia']

    //  1番目(index)の位置に2個(howMany)取り除き、germany(elem)を追加する。
    const arr = ['japan', 'america', 'rusia'];
    const splice = arr.splice(0, 2, 'germany');
    //  splice: ['japan', 'america']
    //  arr: ['germany', 'rusia']

unshift
配列の最初に要素を追加し、新しい配列数を返却します。

    const arr = ['japan', 'america', 'rusia'];
    const unshift = arr.unshift('germany');
    //  unshift: 4
    //  arr: ['germany', 'japan', 'america', 'rusia']