MapとSetの基本
キーから値を検索するにはMap、一意な値を扱うにはSetを使います。反復、変換、簡単なパターンを練習します。
「MapとSetの基本」はCoddyKit上の無料JavaScript Academyレッスンです。 これはレッスン1/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavaScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 JavaScript Academyコースには全3レッスンが含まれています。
なぜMapとSetなのか
目標：適切なコンテナを選びます。
- Map：キーと値の組（キーには任意の型を使用可能）
- Set：重複しない値
- 反復処理と変換
- 日常的に使える小さなパターン
Map：set/get/has
Mapにはset、get、has、delete、clearがあり、sizeプロパティも備わっています。
// Map: key→value with any key type
const userToScore = new Map();
// set values
userToScore.set("ayla", 10);
userToScore.set("mina", 15);
// read values
console.log("ayla:", userToScore.get("ayla"));
console.log("has lena?", userToScore.has("lena"));
// size
console.log("size:", userToScore.size);
Set：重複しない値
Setは各値を1つだけ保持し、重複した値は無視します。
// Set: unique values
const seen = new Set();
// add values (duplicates are ignored)
seen.add("red");
seen.add("blue");
seen.add("red"); // ignored
console.log("size:", seen.size);
console.log("has red?", seen.has("red"));
seen.delete("blue");
console.log("after delete:", seen.size);
ObjectよりMapを使う理由
Mapではオブジェクトの同一性をキーとして保持できます。通常のオブジェクトではキーが文字列に変換されます。
// Map can use objects as keys directly
const key1 = { id: 1 };
const key2 = { id: 1 }; // different reference
const map = new Map();
map.set(key1, "A");
console.log("get key1:", map.get(key1));
console.log("get key2:", map.get(key2)); // undefined (different object)
const obj = {};
obj[key1] = "B"; // coerces key to "[object Object]"
console.log("object key:", obj["[object Object]"]);
変換
Setから重複のない配列を作成できます。pairsからMapを作成し、entries()を使って元に戻すこともできます。
// Unique array values via Set
const nums = [2, 2, 3, 4, 3];
const unique = Array.from(new Set(nums));
console.log("unique:", unique);
// Map from pairs; back to pairs
const pairs = [["a", 1], ["b", 2]];
const m = new Map(pairs);
console.log("get a:", m.get("a"));
console.log("entries:", Array.from(m.entries()));
覚えておきたいパターン
小さなパターン：
- カウントにはMapを使います（キー → 数値）。
- メンバーシップの素早い確認にはSetを使います。
- キーが文字列でない場合や、挿入順が必要な場合はMapを優先します。
Setの一意性クイズ
簡単な確認：一意性です。
まとめ
まとめ：キーと値の検索（キーの型は任意）にはMap、重複しない値にはSetを選びます。entries()/Array.fromを使って反復処理や変換を行えます。
よくある質問
「MapとSetの基本」レッスンは無料ですか？
はい。「MapとSetの基本」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、JavaScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 JavaScript Academyコースには全3レッスンが含まれています。
「MapとSetの基本」で何を学びますか？
キーから値を検索するにはMap、一意な値を扱うにはSetを使います。反復、変換、簡単なパターンを練習します。 ブラウザで直接実行するハンズオンコードでJavaScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
JavaScript Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのJavaScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/3です。
「MapとSetの基本」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このJavaScript Academyレッスンでコードを書いて実行できますか？
はい。すべてのJavaScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。