0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

[JavaScript]開発で使いそうな配列操作

Posted at

#自己紹介
現在都内の企業でWebエンジニアのインターン生としてお世話になっている大学2年生です!
インターンや個人開発で学んだことや苦労したことを記事にしています!
よろしくお願いします🙇🏻‍♂️

#はじめに
今回は開発で使いそうな配列操作についてアウトプットしていこうと思います!

#スプレッド構文(...Array)
###配列の展開

const array1 = [1, 2];
const sum = (a, b) => console.log(a + b);
sum(...array1); //配列を順番に処理
//コンソール:3

###配列のコピー、結合

const array2 = [1, 2];
const array3 = [3, 4];
const array4 = [...array2, ...array3];
console.log(array4);
//コンソール:[1, 2, 3, 4]

#map関数
###returnされた結果によって新しい配列を生成

const nameArray = ["鈴木", "佐藤", "田中"];
const nameArray2 = nameArray.map((name) => {
  return name;
});
console.log(nameArray2);
//コンソール: ['鈴木', '佐藤', '田中']

###配列をループして処理をする
for文をよりスマートに書ける

const nameArray = ["鈴木", "佐藤", "田中"];
nameArray.map((name, index) =>
  console.log(`${index + 1}番目は${name}です。`)
);
//コンソール:
// 1番目は鈴木です。
// 2番目は佐藤です。
// 3番目は田中です。

第2引数を使わない場合は省略可能

const nameArray = ["鈴木", "佐藤", "田中"];
nameArray.map((name) => console.log(name));
//コンソール:
// 鈴木
// 佐藤// 田中

#filter関数
###条件にあった要素だけ取り出す

const numArray = [1, 2, 3];
const numArray2 = numArray.filter((num) => {
  return num % 2 === 1; //奇数だけ取り出す
});
console.log(numArray2);
//コンソール:[1, 3]

#終わりに
今回は配列操作について書きました!
この記事がJavaScript初心者の方の役に立てたら嬉しいです!
ではよいJavaScriptライフを😇

0
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
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?