LoginSignup
1
0

More than 1 year has passed since last update.

【JS】学習したメソッドのMEMO

Last updated at Posted at 2022-10-23

備忘録として淡々とJSのメソッド書いていくだけです。
随時更新していくつもりですが、だいぶざっくりしてると思います。

配列を操作できるメソッド

push

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

const fruits = ["りんご", "バナナ", "メロン"];

console.log(fruits); //=> ["りんご", "バナナ", ”メロン”]

fruits.push("いちご"); //配列に新しい要素を追加

console.log(fruits); //=> ["りんご", "バナナ", "メロン", "いちご"] ※要素が追加されてる

forEach

配列の中の要素を1つずつ取り出し、全ての要素に対して繰り返し処理を行う

使い方
配列 = [要素1, 要素2, 要素3]

配列.forEach((引数) => {
    処理内容の記述
});

//配列の要素1から順番に引数に渡され、繰り返し処理が行われる

引数に渡されている関数をコールバック関数と呼ぶ

const fruits = ["りんご", "バナナ", "メロン"];

fruits.forEach((fruit) => {
    console.log(fruit);
});

//出力結果
りんご
バナナ
メロン

find

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

使い方
配列 = [要素1, 要素2, 要素3]

定数変数 = 配列.find((引数) => {
   return 条件式の記述
});

// 条件を満たした最初の要素のみが定数(変数)に代入される

※配列のオブジェクト要素に対しても使える
オブジェクトのプロパティを条件として使用する場合、そのプロパティを持っているオブジェクトそのものを取り出してくる

filter

記述した条件に合う要素のみを取り出して新しい配列を作成するメソッド

使い方
配列 = [要素1, 要素2, 要素3]

定数変数 = 配列.filter((引数) => {
   return 条件式の記述
});

// 条件を満たした全ての値が取り出され、新しい配列となって定数(変数)に代入される

※配列のオブジェクト要素に対しても使える
オブジェクトのプロパティを条件として使用する場合、そのプロパティを持っているオブジェクトそのものを取り出して返ってくる

map

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

使い方
配列 = [要素1, 要素2, 要素3]

定数変数 = 配列.filter((引数) => {
   return 処理  // コールバック関数の中の処理は { return 値 } と書く
});

※配列のオブジェクト要素に対しても使える

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0