JavaScrip基礎メモその6

pushメソッド

pushメソッドは配列の最後に新しい要素を追加するメソッドである。

const numbers = [1, 2, 3];
console.log(numbers);
number.push(4);
console.log(numbers);

結果
[1, 2, 3]
[1, 2, 3, 4]
4が新しくついかされた。

forEach

forEachメソッドは配列の中の要素を1つずつ取り出して、全ての要素に繰り返し同じ処理を行うメソッドである。

const numbers = [1, 2, 3];

numbers.forEach((number) => {
  console.log(number);
});
// (number) => {console.log(number);}はコールバック関数という

結果
1 ※引数numberに1が代入され、関数の処理が実行
2 ※引数numberに2が代入され、関数の処理が実行
3 ※引数numberに3が代入され、関数の処理が実行

forEachメソッドの引数には、アロー関数が入っている。
配列内の要素が1つずつ順番にアロー関数の引数に代入され、処理が繰り返し実行される。

配列 = [要素1, 要素2, 要素3];

配列.forEach((引数) => {処理});
              // アロー関数

配列の中の要素を1つずつ取り出して同じ処理をする。

引数に入っている関数はコールバック関数と呼ぶ。

findメソッド

findメソッドは条件式に合う1つ目の要素を配列の中から取り出すメソッドである。

const numbers = [1, 3, 5, 7];
const foundNumber = numbers.find((number) => {
  return number > 3;
});
console.log(foundNumber);

結果
5

条件に合う最初の要素が取り出される。
1つしか取り出さない。

const characters = [
  {id: 1, name: "kei"},
  {id: 2, name: "gen"}
];

const foundCharacter = characters.find((character) => {
  return character.id === 1;
});
console.log(foundCharacter);

結果
{id: 1, name: "kei"}

filterメソッド

filterメソッドは条件に合う要素のみを取り出して新しい配列を作成するメソッドである。

const numbers = [1, 3, 5, 7];
const filteredNumbers = numbers.filter((number) => {
  return number > 3;
});
console.log(filterdNumbers);

結果
[5, 7]

mapメソッド

mapメソッドは配列内の全ての要素に処理を行い、その戻り値から新しい配列を作成するメソッドである。

const numbers = [1, 2, 3];
const doubledNumbers = numbers.map((number) => {
  return number * 2;
});

console.log(doubledNumbers);

結果
[2, 4, 6]
配列numbersの全ての数値が2倍された