JSのmapメソッドは、配列の各要素に対して与えられた関数を呼び出し、その結果から新しい配列を作成します。このメソッドは、配列の要素を変換したり、フィルタリングしたりする際に非常に便利です。以下に、mapメソッドの基本的な使い方を紹介します。
基本的な構文
const newArray = array.map(callback(currentValue[, index[, array]]) {
// 新しい要素の値を返す
}, [thisArg]);
‘‘‘
* callback: 新しい配列の各要素を生成するために呼び出される関数。
* currentValue: 現在処理されている配列の要素の値。
* index (オプション): 現在処理されている要素のインデックス。
* array (オプション): map メソッドが呼び出された配列自体。
* thisArg (オプション): callback 関数内で this として使用される値。
使用例
1. 各要素を2倍にする
const numbers = [1, 2, 3, 4, 5]; const doubledNumbers = numbers.map(num => num * 2); console.log(doubledNumbers); // Output: [2, 4, 6, 8, 10] ‘‘‘
文字列を長さに変換する ‘‘‘JS const strings = ['apple', 'banana', 'orange']; const lengths = strings.map(str => str.length); console.log(lengths); // Output: [5, 6, 6] ‘‘‘
オブジェクトのプロパティを抽出する ‘‘‘JS const users = [ { id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 3, name: 'Charlie' } ]; const userIds = users.map(user => user.id); console.log(userIds); // Output: [1, 2, 3] ‘‘‘
注意点 * map メソッドは元の配列を変更しません。新しい配列を返します。 * 元の配列の要素を変更する場合は、forEach メソッドを使用してください。
これで、map メソッドの基本的な使用方法を理解できるはずです。このメソッドを上手に活用して、コードをより効率的に記述できるようになるでしょう。
