こんにちは。
本日はMapオブジェクトについてです。
概要
Mapオブジェクトは、keyとvalueをペアで保持することができます。
今回は、追加・key,valueの出力・クリアの
サンプルを記載します。
本記事では、keyを食べ物、valueを値段として作成しました。
サンプル全体
let foodMap = new Map(); foodMap.set("りんご", 100); foodMap.set("いちご", 500); foodMap.set("メロン", 1000); // sizeを出力 console.log(`size = ${foodMap.size}`); // keyからvalueを取得 console.log(`りんごの値段は ${foodMap.get("りんご")} 円`); console.log("\n----- forを使用 -----"); // keyの値を出力 for (let k of foodMap.keys()) { console.log(`key = ${k}`); } // valueの値を出力 for (let v of foodMap.values()) { console.log(`value = ${v}`); } // keyとvalueの値を出力 for (let [k, v] of foodMap) { console.log(`[key, value] = [${k}, ${v}]`); } console.log("\n----- forEachを使用 -----"); // keyとvalueの値を出力 foodMap.forEach((v, k) => { console.log(`[key, value] = [${k}, ${v}]`); }); // すでに含まれているかチェック console.log(`\nすいかは存在している? = ${foodMap.has("すいか")}`); console.log(`いちごは存在している? = ${foodMap.has("いちご")}`); // foodMapをクリア foodMap.clear(); console.log(`\nクリア後のサイズ = ${foodMap.size}`);
結果は以下のようになります。
size = 3 りんごの値段は 100 円 ----- forを使用 ----- key = りんご key = いちご key = メロン value = 100 value = 500 value = 1000 [key, value] = [りんご, 100] [key, value] = [いちご, 500] [key, value] = [メロン, 1000] ----- forEachを使用 ----- [key, value] = [りんご, 100] [key, value] = [いちご, 500] [key, value] = [メロン, 1000] すいかは存在している? = false いちごは存在している? = true クリア後のサイズ = 0
追加
追加する際は、set(key, value)を使用します。
foodMap.set("りんご", 100);
keyからvalueの取得
keyからvalueを取得する場合は、get(key)を使用します。
console.log(`りんごの値段は ${foodMap.get("りんご")} 円`);
key・valueの取得
forとforEachの2つの方法を使用しました。
forを使用
keyの値のみを取得する場合は
foodMap.keys()でMap内のすべてのkeyを取得して
forでループして1つずつ取得します。
for (let k of foodMap.keys()) { console.log(`key = ${k}`); }
valueの場合は、foodMap.values()で同様に取得します。
for (let v of foodMap.values()) { console.log(`value = ${v}`); }
key,valueを一気に取得したい場合は
foodMapをループでまわして取得します。
for (let [k, v] of foodMap) { console.log(`[key, value] = [${k}, ${v}]`); }
forEachを使用
forEachを使用して取得することも可能です。
foodMap.forEach((v, k) => { console.log(`[key, value] = [${k}, ${v}]`); });
存在チェック
すでに要素が存在しているかどうかの判定はhas()を使用します。
console.log(`\nすいかは存在している? = ${foodMap.has("すいか")}`); console.log(`いちごは存在している? = ${foodMap.has("いちご")}`);
存在していればtrue、存在していなければfalseを返します。
要素のクリア
要素をクリアする場合はclearを使用します。
foodMap.clear();
まとめ
キーと値をペアで保持した場合ってたくさんあります。
使い方も簡単なので是非覚えておきたいですね。
以上。