はじめに
配列の操作は普段よく使うので、関連メソッドをまとめてみます。
配列の重複値を削除
new setで重複値取り除く
constdata=["four","one","two","three","one"]constnewData=newSet(data)console.log(newData)
配列の値置換
splice() メソッドは、 既存の要素を取り除いたり、置き換えたり、新しい要素を追加したりすることで、配列の内容を変更します。
constdata=["four","one","two","three","one"]data.splice(1,1,'one1','one2')console.log(data)
map、fromメソッドで配列値加工
fromメソッド
Array.from() メソッドは、配列風オブジェクトや反復可能オブジェクトから、新しい、浅いコピーの Array インスタンスを生成します。
constdata=["1","2","3"]console.log(Array.from(data,x=>x+x));Array ["11", "22", "33"]
mapメソッド
vararr=[1,3,6,9];constmap=arr.map(x=>x**2);console.log(map);Array [1, 9, 36, 81]
配列クリア
vararr=[1,3,6,9];// 長さを0でクリアarr.length=0// 空の配列でリセット//arr = []console.log(arr);Array []
配列をオブジェクトに変換
vararr=["one","two","three"];varobj={...arr}console.log(obj);Object { 0: "one", 1: "two", 2: "three" }
配列に初期値をfill
vararr=newArray(8).fill(100)console.log(arr)Array [100, 100, 100, 100, 100, 100, 100, 100]
配列のマージ
constarr1=newArray(8).fill(100)constarr2=newArray(8).fill(200)constarr3=[...arr1,...arr2]console.log(arr3)Array [100, 100, 100, 100, 100, 100, 100, 100, 200, 200, 200, 200, 200, 200, 200, 200]
concatも配列マージできるメソッドです。
concat() メソッドは、配列に他の配列や値をつないでできた新しい配列を返します。
スプレッド構文
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Spread_syntax
配列の反転
constarray1=['one','two','three'];constreversed=array1.reverse();console.log('reversed: ',reversed);"reversed: " Array ["three", "two", "one"]
reduceメソッド
reduce() は配列の各要素に対して（引数で与えられた）reducer 関数を実行して、単一の値にします。
constarray=[1,2,3,4];consttotal=array.reduce((total,currentValue)=>total+currentValue)console.log(total)10
filterメソッド
filter() メソッドは、引数として与えられたテスト関数を各配列要素に対して実行し、それに合格したすべての配列要素からなる新しい配列を生成します。
constnums=[10,15,20,25];constoddNums=nums.filter(num=>num%2==1)console.log(oddNums)Array [15, 25]
forEach
for句の代わりとしてよく使います。
constarray=['one','two','three'];array.forEach(function(element){console.log(element);});"one"
"two"
"three"
sort
// 文字列で昇順にするconstdata=['1','2','10','20'];data.sort();console.log(data);// 数字で昇順にするconstdata2=[1,2,10,20];data2.sort();console.log(data2);// 自分の比較メソッドで降順にするconstdata3=[1,2,10,20];data3.sort(function(a,b){if(a<b){return1;}elseif(a>b){return-1;}else{return0;}});console.log(data3);Array ["1", "10", "2", "20"]
Array [1, 10, 2, 20]
Array [20, 10, 2, 1]
ほかもいろんなメソッドがあります。
参考URL
Map: https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Map
Arraya: https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array
Set: https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Set
以上