JavaScriptでのデータ操作を快適に！配列・オブジェクトの便利メソッドまとめ

JavaScriptでデータを扱う際、配列やオブジェクトを操作する機会が多いでしょうか。
しかし、基本的なループやif文だけで処理を行うと、コードが冗長になりがちです。
そこで、便利な組み込みメソッドを活用することで、シンプルで効率的なコードを書くことができます。
本記事では、よく使われる配列・オブジェクトのメソッドを詳しく解説します。

1. 配列の便利メソッド

map() – 配列の各要素を変換する

map() は配列の各要素に対して処理を行い、新しい配列を作成するメソッドです。

const numbers = [1, 2, 3, 4, 5];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6, 8, 10]

filter() – 条件に合う要素を抽出

特定の条件を満たす要素のみを取得したい場合は filter() を使用します。

const numbers = [10, 15, 20, 25, 30];
const greaterThan20 = numbers.filter(num => num > 20);
console.log(greaterThan20); // [25, 30]

reduce() – 配列を集約する

配列の全要素を使って単一の値を計算する際に reduce() が便利です。

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum); // 15

2. オブジェクトの便利メソッド

Object.keys() – オブジェクトのキーを取得

オブジェクトのすべてのキーを配列として取得できます。

const user = { name: "Taro", age: 25, city: "Tokyo" };
console.log(Object.keys(user)); // ["name", "age", "city"]

Object.values() – オブジェクトの値を取得

キーではなく値の配列が欲しい場合は Object.values() を使います。

console.log(Object.values(user)); // ["Taro", 25, "Tokyo"]

Object.entries() – キーと値のペアを取得

Object.entries() を使うと、キーと値のペアを配列の配列として取得できます。

console.log(Object.entries(user)); // [["name", "Taro"], ["age", 25], ["city", "Tokyo"]]

3. 実用例：データの整理

例えば、APIから取得したデータのリストを整理するときに、これらのメソッドを組み合わせると非常に効率的です。

const users = [
  { name: "Alice", age: 30 },
  { name: "Bob", age: 20 },
  { name: "Charlie", age: 25 }
];

const sortedUsers = users.sort((a, b) => a.age - b.age);
console.log(sortedUsers);