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?

JavaScriptの配列:便利なメソッドとテクニック

Posted at

こんにちは、JavaScriptを学んでいる皆さん!今回は、配列の強力な機能と便利なメソッドについて詳しく見ていきましょう。

1. Array(配列)の基本

配列は複数の値をまとめて扱うことができるデータ構造です。JavaScriptでは、以下のように配列を作成できます:

let fruits = ['りんご', 'バナナ', 'オレンジ'];

2. 便利な配列メソッド

push() と pop()

push()メソッドは配列の末尾に要素を追加し、pop()メソッドは末尾の要素を削除して返します。

fruits.push('いちご');  // ['りんご', 'バナナ', 'オレンジ', 'いちご']
let lastFruit = fruits.pop();  // lastFruit = 'いちご'

join()

join()メソッドは配列の要素を指定した区切り文字で連結した文字列を返します。

console.log(fruits.join(', '));  // "りんご, バナナ, オレンジ"

indexOf() と lastIndexOf()

これらのメソッドは、指定した要素の位置(インデックス)を検索します。

console.log(fruits.indexOf('バナナ'));  // 1

slice()

slice()メソッドは配列の一部を切り出して新しい配列を作成します。

let someFruits = fruits.slice(1, 3);  // ['バナナ', 'オレンジ']

splice()

splice()メソッドは配列の一部を削除したり、新しい要素を追加したりします。

fruits.splice(1, 1, 'キウイ');  // 'バナナ'を'キウイ'に置き換え

3. 高度な配列操作

map()

map()メソッドは各要素に対して同じ操作を行い、新しい配列を作成します。

let upperFruits = fruits.map(fruit => fruit.toUpperCase());

filter()

filter()メソッドは条件に合う要素だけを抽出して新しい配列を作成します。

let longFruits = fruits.filter(fruit => fruit.length > 5);

reduce()

reduce()メソッドは配列の要素を累積的に処理します。

let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce((acc, cur) => acc + cur, 0);  // 15

まとめ

これらのメソッドを使いこなすことで、配列を効率的に操作できます。実際にコードを書いて試してみることをおすすめします。次回は、オブジェクトについて詳しく見ていく予定です。それでは、Happy Coding!

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?