Mapメソッド

CoddyのJavaScriptジャーニー「論理とフロー」セクションの一部 — レッスン 52/65。

map() メソッドは、呼び出し元の配列のすべての要素に対して、提供された関数を呼び出した結果を使用して、新しい配列を作成します。各要素を変換し、同じ長さの新しい配列を返します。

基本構文:

let newArray = arr.map(function(currentValue, index, array) {
    // newArray のための要素を返す
});

簡単な例を次に示します：

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

同じ例をより短い構文で記述すると次のようになります：

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

map()メソッドは、元の配列を変更しません。常に新しい配列を返します。

チャレンジ

簡単

名前（文字列）の配列を引数として受け取る、formatNamesという名前の関数を作成してください。この関数は、map()メソッドを使用して、各名前がタイトルケース（各単語の最初の文字が大文字、残りが小文字）になるように変換する必要があります。フォーマットされた名前の新しい配列を返してください。

チートシート

map() メソッドは、元の配列のすべての要素に対して関数を呼び出すことで、新しい配列を作成します：

let newArray = arr.map(function(currentValue, index, array) {
    // newArray のための要素を返す
});

アロー関数を使用した例：

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

map() メソッドは元の配列を変更せず、常に同じ長さの新しい配列を返します。

自分で試してみよう

function formatNames(names) {
    return names.map(name => {
        // ここにコードを書いてください
    })
}

腕試し

このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。

Mapメソッド

チートシート

論理とフローのすべてのレッスン