「労働者が自分の仕事をうまくやりたいなら、まず自分の道具を研ぎ澄まさなければなりません。」 - 孔子、「論語。陸霊公」
表紙 > プログラミング > JS でのマップ

JS でのマップ

2024 年 11 月 2 日に公開
ブラウズ:203

Map in JS

JavaScript のマップは、キーが任意の型であるキーと値のペアのコレクションです。挿入順序が保持されます。つまり、項目は追加された順序で反復されます。

マップの主な特徴;

  1. 一意のキー: マップ内の各キーは一意です。
  2. キーの任意のデータ型: オブジェクトとは異なり、キーは関数、オブジェクト、または任意のプリミティブ型を含む任意のデータ型にすることができます。
  3. Iterable: Map.
  4. のキー、値、またはエントリを反復処理できます。

基本操作

マップの作成

let funnyMap = new Map();

マップへの要素の追加

funnyMap.set('a', 1); // string key
funnyMap.set(2, 'two'); // number key
funnyMap.set(true, 'yes'); // boolean key
funnyMap.set({name: 'obj'}, 'object'); // object key

// Funny example
funnyMap.set('knock-knock', 'who’s there?');

マップから値を取得する

console.log(funnyMap.get('a')); // 1
console.log(funnyMap.get(2)); // two
console.log(funnyMap.get(true)); // yes

// Funny example
console.log(funnyMap.get('knock-knock')); // who’s there?

キーを確認する

console.log(funnyMap.has('a')); // true
console.log(funnyMap.has(42)); // false

// Funny example
console.log(funnyMap.has('chicken')); // false (It crossed the road)

要素の削除

funnyMap.delete('a');
console.log(funnyMap.has('a')); // false

// Funny example
funnyMap.delete('knock-knock');
console.log(funnyMap.get('knock-knock')); // undefined (No one answered)

マップのサイズを取得する

console.log(funnyMap.size); // 3 after deletion

// Funny example
console.log(`The map has ${funnyMap.size} jokes left.`);

マップをクリアする

funnyMap.clear();
console.log(funnyMap.size); // 0

// Funny example
console.log(`All jokes are cleared from the map.`);

マップの反復処理

...の
に使用しています

funnyMap.set('banana', 'yellow');
funnyMap.set('apple', 'red');
funnyMap.set('grape', 'purple');

// Iterating over keys
for (let key of funnyMap.keys()) {
    console.log(`Key: ${key}`);
}

// Iterating over values
for (let value of funnyMap.values()) {
    console.log(`Value: ${value}`);
}

// Iterating over entries
for (let [key, value] of funnyMap.entries()) {
    console.log(`Key: ${key}, Value: ${value}`);
}

// Funny example
funnyMap.set('dad joke', 'What do you call fake spaghetti? An impasta!');
for (let [key, value] of funnyMap.entries()) {
    console.log(`Here’s a ${key}: ${value}`);
}

forEach の使用

funnyMap.forEach((value, key) => {
    console.log(`Key: ${key}, Value: ${value}`);
});

// Funny example
funnyMap.set('bad pun', 'I’m reading a book on anti-gravity. It’s impossible to put down!');
funnyMap.forEach((value, key) => {
    console.log(`Here’s a ${key}: ${value}`);
});

実用的な用途

文字数カウント (面白いバージョン)

ジョーク コレクションに特定の単語が何回出現するかを数えたいと想像してください:

let jokeText = "Why did the scarecrow win an award? Because he was outstanding in his field!";

// Splitting text into words
let words = jokeText.split(/\W /);

let wordCount = new Map();

words.forEach(word => {
    word = word.toLowerCase();
    if (wordCount.has(word)) {
        wordCount.set(word, wordCount.get(word)   1);
    } else {
        wordCount.set(word, 1);
    }
});

wordCount.forEach((count, word) => {
    console.log(`Word: ${word}, Count: ${count}`);
});

// Funny example
console.log('Word counts in our joke:');
wordCount.forEach((count, word) => {
    console.log(`"${word}": ${count} times`);
});

まとめ

JavaScript のマップは、あらゆるデータ型のキーと値のペアを保持でき、簡単な反復メソッドを提供し、要素の順序を維持できる多用途のデータ構造です。これは、ジョークの単語を数えたり、さまざまななぞなぞに対する回答を保存したりするなど、通常のオブジェクトよりも柔軟なキー管理が必要なシナリオに役立ちます。

リリースステートメント この記事は次の場所に転載されています: https://dev.to/__khojiakbar__/map-in-js-59k6?1 侵害がある場合は、[email protected] に連絡して削除してください。
最新のチュートリアル もっと>

免責事項: 提供されるすべてのリソースの一部はインターネットからのものです。お客様の著作権またはその他の権利および利益の侵害がある場合は、詳細な理由を説明し、著作権または権利および利益の証拠を提出して、電子メール [email protected] に送信してください。 できるだけ早く対応させていただきます。

Copyright© 2022 湘ICP备2022001581号-3