JavaScript勉強ログ 配列関係のメソッド2

◾️配列の結合や分離

.concat()

配列の結合。元の配列は上書きされない。

const arrayCats = ['tama','mike'];
const arrayDogs = ['pochi','hachi'];
console.log(arrayCats.concat(arrayDogs));
//(4) ['tama', 'mike', 'pochi', 'hachi']
console.log(arrayCats);
//(2) ['tama', 'mike']
//→もとの配列は変化しない

console.log(arrayCats.concat(arrayDogs,'kuro'));
//(5) ['tama', 'mike', 'pochi', 'hachi', 'kuro']

.slice()

元の配列を壊さずに、取り出す。追加、置き換えはできない。

const foods = ['蕎麦','ピザ','ラーメン','ハンバーガー','寿司','うどん'];
console.log(foods.slice());
//(6) ['蕎麦', 'ピザ', 'ラーメン', 'ハンバーガー', '寿司', 'うどん']
console.log(foods.slice(2));
//(4) ['ラーメン', 'ハンバーガー', '寿司', 'うどん']
//配列の2番目以降が切り取られる
console.log(foods.slice(2,4));
//(2) ['ラーメン', 'ハンバーガー']
//配列の2番目以降3番目まで（4番目は含まれない）
console.log(foods);
//(6) ['蕎麦', 'ピザ', 'ラーメン', 'ハンバーガー', '寿司', 'うどん']
//元の配列は書き換えられない

.splice()

配列の削除・追加・置き換えの3つの操作ができる。元の配列は上書きされる。

第一引数に開始値、第二引数に何個消すか、第三引数に何を追加するか。

splice() は1回につき1か所しか操作できないので複数の場所に反映したいときは順番に処理を書く。

const week = ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday',];
console.log(week.splice(1,2));
//(2) ['Tuesday', 'Wednesday']
//切り取った配列
console.log(week);
//(4) ['Monday', 'Thursday', 'Friday', 'Saturday']
//元の配列は上書きされる

console.log(week.splice(1,0,'Tuesday', 'Wednesday'));
//[]
// 消したものはないのでから配列が表示される

console.log(week);
//(6) ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']

week.splice(0,0,'Sunday');
console.log(week);
//(7) ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']

◾️特定の要素が含まれているか判定

.include()

特定の値が含まれているか、真偽値を返す。

const color = ['red','blue','pink','yellow','orange'];
console.log(color.includes('red'));
//true

.indexOf()

指定した値と同じ要素の位置を返す。先頭から探す。ないときは-1を返す。

console.log(color.indexOf('orange'));
//4
console.log(color.indexOf('green'));
//-1

.lastIndexOf()

指定した値と同じ要素の位置を返す。末尾から探す。ないときは-1を返す。

console.log(color.lastIndexOf('orange'));
//4
console.log(color.lastIndexOf('green'));
//-1

テスト関数で判定するメソッドについては、筆者が関数についての学習がまだのため、学習後にまとめたいと思います。

• .find()
• .findIndex()
• .every()
• .some()
• Object.groupBy()
• Map.groupBy()