ES6コレクション：MAP、SET、WEALDMAP、WEAKSETを使用します-jsチュートリアル-php.cn

ES6 Collections: Using Map, Set, WeakMap, WeakSet

この記事では、4つの新しいES6コレクションと彼らがもたらす利点について説明します。

ほとんどの主要なプログラミング言語には、いくつかのタイプのデータ収集があります。 Pythonには、リスト、タプル、辞書があります。 Javaには、リスト、コレクション、マップ、キューがあります。 Rubyにはハッシュと配列があります。これまでのところ、JavaScriptには配列のみがあります。オブジェクトと配列は、JavaScriptの右側のヘルパーです。 ES6は、言語の強力で表現力豊かな機能を強化する4つの新しいデータ構造を導入します：マップ、セット、弱点、弱いマップ。

キーポイント

ES6のマップとセットは、あらゆるタイプのキー価値ペアのコレクションです。これらは、迅速な検索のために最適化され、値を追加、削除、ループする方法を提供します。ただし、オブジェクトへの強い参照を保持しています。オブジェクトは、オブジェクトが大きく、不要になった場合に高価になる可能性があります。
ES6は、MAPと設定に似ていますが、オブジェクトへの弱い参照を保持しているWeakMapとWeaksetも導入します。これは、これらのオブジェクトが不要になった場合、ゴミ収集される可能性があることを意味します。これは、メモリ管理に非常に有益です。
新しいES6コレクションはより大きな柔軟性を提供しますが、多くの場合、JavaScriptオブジェクトをコレクションとして使用できます。オブジェクトを使用するかキー付きコレクションを使用するかを決定する際、開発者は、動的なキールックアップの必要性、値の交換性、キー価値ペアの追加または削除の頻度などの要因を考慮する必要があります。

ES5では、JavaScriptオブジェクト（キーと値のあるプロパティのコレクションのみ）がハッシュをシミュレートできますが、オブジェクトをハッシュとして使用するにはいくつかの欠点があります。

Disadvantage＃1：ES5のキーは文字列

javaScriptオブジェクトプロパティキーは文字列でなければなりません。これにより、異なるデータ型のキー価値ペアのコレクションになる能力が制限されます。もちろん、文字列に他のデータ型をキャストできますが、これにより追加の作業が追加されます。

Disdvantage＃2：オブジェクトは本質的に反復可能ではありません

オブジェクトはコレクションとして設計されていないため、オブジェクトの属性の数を判断する効果的な方法はありません。（たとえば、Object.Keysは遅い）。オブジェクトのプロパティをループすると、プロトタイププロパティも取得できます。すべてのオブジェクトに反復可能なプロパティを追加できますが、すべてのオブジェクトがコレクションとして使用されることを意図しているわけではありません。 for…in loop and hasownProperty（）メソッドを使用できますが、これは単なる回避策です。オブジェクトのプロパティをループすると、挿入された順序でプロパティが必ずしも取得されるわけではありません。

Disadvantage＃3：組み込みメソッドの競合の課題

オブジェクトには、コンストラクター、トストリング、Valueofなどの組み込みメソッドがあります。それらのいずれかがプロパティとして追加されると、競合する可能性があります。 object.create（null）を使用して、裸のオブジェクト（object.prototypeから継承されていない）を作成できますが、これはまだ回避策です。

ES6には新しいコレクションデータ型が含まれているため、オブジェクトを使用して欠点に耐える必要はなくなりました。

マップを作成し、一般的な方法を使用します

const map = new Map(); // 创建一个新的Map
map.set('hobby', 'cycling'); // 设置键值对

const foods = { dinner: 'Curry', lunch: 'Sandwich', breakfast: 'Eggs' }; // 新对象
const normalfoods = {}; // 新对象

map.set(normalfoods, foods); // 设置两个对象作为键值对

for (const [key, value] of map) {
  console.log(`${key} = ${value}`); // hobby = cycling  [object Object] = [object Object]
}

map.forEach((value, key) => {
  console.log(`${key} = ${value}`);
}, map); // hobby = cycling  [object Object] = [object Object]

map.clear(); // 清除键值对
console.log(map.size === 0); // True

ログイン後にコピー

set

セットは、重複していない値の順序付けられたリストです。セットは配列のようにインデックス化されていませんが、キーを使用してアクセスできます。セットはすでにJava、Ruby、Python、その他多くの言語に存在しています。 ES6セットと他の言語のセットの1つの違いは、ES6で順序が重要であることです（他の多くの言語ではありません）。主要なセット方法は次のとおりです

この例をJSBIN

const planetsOrderFromSun = new Set();
planetsOrderFromSun.add('Mercury');
planetsOrderFromSun.add('Venus').add('Earth').add('Mars'); // 可链式方法
console.log(planetsOrderFromSun.has('Earth')); // True

planetsOrderFromSun.delete('Mars');
console.log(planetsOrderFromSun.has('Mars')); // False

for (const x of planetsOrderFromSun) {
  console.log(x); // 输入和输出顺序相同 - Mercury Venus Earth
}
console.log(planetsOrderFromSun.size); // 3

planetsOrderFromSun.add('Venus'); // 尝试添加重复项
console.log(planetsOrderFromSun.size); // 仍然是3，没有添加重复项

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

ログイン後にコピー

この問題を解決するために、ES6はWeakMapとWeaksetと呼ばれる2つの新しい弱いセットも導入しました。これらのES6コレクションは、メモリからクリアされる必要がなくなったオブジェクトを許可するため、「弱い」です。

weakmap

weakmapは、紹介した3番目の新しいES6コレクションです。 WeakMapは通常のマップに似ていますが、方法が少なく、ガベージコレクションには上記の違いがあります。

const aboutAuthor = new WeakMap(); // 创建新的WeakMap
const currentAge = {}; // 键必须是对象
const currentCity = {}; // 键必须是对象

aboutAuthor.set(currentAge, 30); // 设置键值
aboutAuthor.set(currentCity, 'Denver'); // 键值可以是不同数据类型

console.log(aboutAuthor.has(currentCity)); // 测试WeakMap是否包含键

aboutAuthor.delete(currentAge); // 删除键

ログイン後にコピー

プライベートデータのユースケース

次の例は、JavaScriptの専門家Nicholas C. Zakasからのものです：<

ここでWeakMapを使用すると、オブジェクトデータをプライベートに保つプロセスが簡素化されます。個人のオブジェクトを参照できますが、特定の個人インスタンスがない場合、PrivateDataWeakMapはアクセスできません。

dom node use case

var Person = (function() {
  var privateData = new WeakMap();

  function Person(name) {
    privateData.set(this, { name: name });
  }

  Person.prototype.getName = function() {
    return privateData.get(this).name;
  };

  return Person;
}());

ログイン後にコピー

PositionWalkerは、現在のノードとしてDOMサブツリーの位置を追跡し、そのノード内のオフセットを追跡します。

const map = new Map(); // 创建一个新的Map
map.set('hobby', 'cycling'); // 设置键值对

const foods = { dinner: 'Curry', lunch: 'Sandwich', breakfast: 'Eggs' }; // 新对象
const normalfoods = {}; // 新对象

map.set(normalfoods, foods); // 设置两个对象作为键值对

for (const [key, value] of map) {
  console.log(`${key} = ${value}`); // hobby = cycling  [object Object] = [object Object]
}

map.forEach((value, key) => {
  console.log(`${key} = ${value}`);
}, map); // hobby = cycling  [object Object] = [object Object]

map.clear(); // 清除键值对
console.log(map.size === 0); // True

ログイン後にコピー

weakset

weaksetは、参照するオブジェクトが不要になったときに、要素をガベージに収集できるセットのセットです。 weadsetは反復を許可しません。彼らのユースケースは非常に限られています（少なくとも当面は）。ほとんどの初期の採用者は、Weaksetを使用してオブジェクトを変更せずにタグ付けできると述べました。 es6-features.orgには、オブジェクトがタグ付けされているかどうかを追跡するために、弱点から要素を追加および削除する例があります。

const planetsOrderFromSun = new Set();
planetsOrderFromSun.add('Mercury');
planetsOrderFromSun.add('Venus').add('Earth').add('Mars'); // 可链式方法
console.log(planetsOrderFromSun.has('Earth')); // True

planetsOrderFromSun.delete('Mars');
console.log(planetsOrderFromSun.has('Mars')); // False

for (const x of planetsOrderFromSun) {
  console.log(x); // 输入和输出顺序相同 - Mercury Venus Earth
}
console.log(planetsOrderFromSun.size); // 3

planetsOrderFromSun.add('Venus'); // 尝试添加重复项
console.log(planetsOrderFromSun.size); // 仍然是3，没有添加重复项

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

ログイン後にコピー

すべての値は同じタイプで、同じ意味で使用できますか？
文字列ではないキーが必要ですか？
キー価値のペアは頻繁に追加または削除されていますか？
キー価値のペアの数（変更が簡単な）はありますか？
コレクションは繰り返されますか？

JavaScriptコレクションは以前は非常に限られていましたが、これはES6で修正されています。これらの新しいES6コレクションは、言語のパワーと柔軟性を高め、それらを採用するJavaScript開発者のタスクを簡素化します。

ES6コレクション（FAQ）に関するFAQ：マップ、セット、weakMap、weakset

JavaScript ES6では、MAPとWeakMapの両方がキー価値ペアを保存するために使用されます。ただし、それらの間にはいくつかの大きな違いがあります。まず、マップでは、キーは任意のタイプであることができますが、weakmapでは、キーはオブジェクトでなければなりません。第二に、MAPにはキー価値のペアの数を確認できるサイズプロパティがありますが、WeakMapにはこのプロパティがありません。最後に、MAPは重要なオブジェクトへの強い参照を保持しています。つまり、マップが存在する限り、ガベージコレクションの資格がないことを意味します。一方、WeakMapは重要なオブジェクトへの弱い参照を保持しています。つまり、オブジェクトへの他の参照がない場合、ゴミ収集される可能性があります。

javascript es6の弱いマップまたは弱点を反復する方法は？

Map and Setとは異なり、WeakMapとWeaksetには要素を反復する方法はありません。これは、キー（弱いマップ）または値（弱点）への弱い参照を保持するように設計されているためです。つまり、これらはいつでもゴミを収集することができます。したがって、要素を繰り返しようとするときに要素がまだ存在するという保証はありません。コレクションを繰り返す必要がある場合は、代わりにマップを使用するか、設定する必要があります。

weakmapまたはweaksetのキーとして元のデータ型を使用できますか？

いいえ、元のデータ型をWeakMapまたはWeakSetのキーとして使用することはできません。これらのコレクションのキーはオブジェクトでなければなりません。これは、WeakMapとWeaksetがキーへの弱い参照を保持しているためです。つまり、それらへの他の参照がなければ、キーを収集することができます。プリミティブデータ型（数字や文字列など）はオブジェクトのように収集されたごみではないため、これらのコレクションのキーとして使用することはできません。

なぜマップまたはセットの代わりに弱体またはweaksetを使用する必要があるのですか？

weakmapとweaksetにはいくつかのユニークな機能があり、場合によっては、マップまたは設定よりも適切である場合があります。彼らはキー（弱いマップ）または値（弱点）への弱い参照を保持しているため、使用していないときにゴミを収集することができます。これは、他のデータをオブジェクトに関連付けたいが、オブジェクトが不要になったときにガベージコレクションを防ぎたくない場合に役立ちます。さらに、WeakMapとWeaksetには要素を反復する方法がないため、保存するデータに一定レベルのプライバシーを提供できます。

WeakMapまたはWeaksetのキーがゴミが収集された場合はどうなりますか？

WeakMapまたはWeakSetのキーがゴミ収集されると、コレクション内の対応するエントリが自動的に削除されます。これは、これらのセットがキーへの弱い参照を保持しているためです。つまり、使用していない場合、キーはガベージを収集できることを意味します。この機能は、JavaScriptアプリケーションのメモリの管理に役立ちます。これは、使用されていないオブジェクトに関連付けられたデータもクリアされることを保証するためです。

weakmapまたはweaksetを使用して一時データを保存できますか？

はい、WeakMapとWeakSetは一時的なデータを保存するのに最適です。彼らはキー（弱いマップ）または値（弱点）への弱い参照を保持しているため、使用していないときにゴミを収集することができます。これは、キーが収集されたガベージである場合、これらのセットに保存されているデータもクリアされることを意味します。これは、手動で掃除することを心配する必要がないため、短時間だけ必要なものを保存するのに役立ちます。

WeakMapまたはWeakSetに特定のキーまたは値が含まれているかどうかを確認する方法は？

HASメソッドを使用して、WeakMapまたはWeakSetに特定のキーが含まれているかどうかを確認できます。この方法は、キーがコレクションに存在するかどうかを示すブール値を返します。ただし、このセットの値がアクセスできないため、この方法を弱体セットで特定の値をチェックすることはできないことを忘れないでください。

WeakMapまたはWeakSetからエントリを削除できますか？

はい、deleteメソッドを使用して、weakmapからエントリを削除できます。このメソッドは、指定されたキーに関連付けられたエントリを削除し、コレクションにキーが存在するかどうかを示すブール値を返します。ただし、このコレクションには削除メソッドがないため、weaksetからエントリを削除することはできません。