ES6 の Map と WeakMap の概要

不言
リリース: 2018-03-31 10:35:35
オリジナル
1587 人が閲覧しました

この記事は、ES6 の Map と WeakMap について共有します。これが、困っている友人の助けになれば幸いです

Map オブジェクトはキーと値のペアを保存します。任意の値 (オブジェクトまたはプリミティブ) をキーまたは値として使用できます。
マップオブジェクトを使用します
let myMap=new Map();
let keyObj={},keyfunc=function(){},keysTring='hello word';
ログイン後にコピー
set(key,value)で値を追加します
myMap.set(keysTring,'keysTring的关联值')
myMap.set(keyfunc,'keyfunc的关联值')
myMap.set(keyObj,'keyObj的关联值')
ログイン後にコピー
sizeを使用してマップのサイズを取得します
console.log(myMap.size)  //3
ログイン後にコピー
get(key)を使用してマップの値を取得します
console.log(myMap.get(keysTring)) //keysTring的关联值
console.log(myMap.get('hello word')) //keysTring的关联值


----------


console.log(myMap.get(keyfunc)) //keyfunc的关联值
console.log(function(){}===keyfunc)  //false 
console.log(myMap.get(function(){})) //undefined, 因为keyFunc !== function () {}


----------


console.log(myMap.get(keyObj)) //keyObj的关联值
console.log({}===keyObj)  //false 
console.log(myMap.get({})) //undefined 因为keyObj !== {}
ログイン後にコピー
としてNaNを使用しますマップのキー
myMap.set(NaN, "not a number");
console.log(myMap.get(NaN))  //not a number

var otherNaN=Number('foo');
console.log(otherNaN)  //NaN
console.log(myMap.get(otherNaN))  //not a number 也可以取值
ログイン後にコピー
Mapと配列 オブジェクト
let kvArray = [["key1", "value1"], ["key2", "value2"]];
var myMap1 = new Map(kvArray);
//使用映射对象常规的构造函数将一个二维键值对数组对象转换成一个映射关系
console.log(myMap1) //Map { 'key1' => 'value1', 'key2' => 'value2' }
console.log(myMap1.get('key1'))  //value1
console.log([...myMap1]) //[ [ 'key1', 'value1' ], [ 'key2', 'value2' ] ]
ログイン後にコピー
forEach()
var myMap2 = new Map(kvArray);
myMap2.forEach((value,index)=>{
    console.log(value+'---'+index)  //value1---key1   value2---key2
})
ログイン後にコピー
for..of
var myMap3 = new Map(kvArray);
for(var a of myMap3){
    console.log(a)      //[ 'key1', 'value1' ] [ 'key2', 'value2' ]
}

for(var [key,value] of myMap3){
    console.log('key:'+key+', value:'+value)  //key:key1, value:value1 key:key2, value:value2
}
ログイン後にコピー
clear()メソッドの関係により、Mapオブジェクト内のすべての要素が削除されます。
let clearMap=new Map();
clearMap.set('hello','word');
console.log(clearMap.size)  //1
clearMap.clear();   //清空
console.log(clearMap.size)  //0
ログイン後にコピー
delete(key) は、Map オブジェクト内の指定された要素を削除するために使用されます。
let delMap=new Map();
delMap.set('hi','word');
delMap.set('hello','word');
console.log(delMap)  //Map { 'hi' => 'word', 'hello' => 'word' }
delMap.delete('hi'); //执行删除操作
console.log(delMap)  //Map { 'hello' => 'word' }
ログイン後にコピー
has(key) は、指定された要素がマップ内に存在するかどうかを示すブール値を返します。
let hasMap=new Map();
hasMap.set('hi','word');
hasMap.set('hi','hello word');
console.log(hasMap)  //Map { 'hi' => 'hello word' }   一样的key后面的value会覆盖前面的值
console.log(hasMap.has('hi')); //true
console.log(hasMap.has('hello')); //false
ログイン後にコピー
entries() は、マップ オブジェクトをイテレータに変換します。
let entriesMap=new Map();
entriesMap.set('a','A');
entriesMap.set('b','B');
let entries=entriesMap.entries();
console.log(entries.next()); //{ value: [ 'a', 'A' ], done: false }
console.log(entries.next().value); //[ 'b', 'B' ]
console.log(entries.next()); //{ value: undefined, done: true }
ログイン後にコピー
values() は、新しい Iterator オブジェクトを返します
let valueMap=new Map();
valueMap.set('a','A');
valueMap.set('b','B');
let values=valueMap.values();
console.log(values.next())  //{ value: 'A', done: false }
console.log(values.next())  //{ value: 'B', done: false }
console.log(values.next())  //{ value: undefined, done: true }
ログイン後にコピー
A WeakMap オブジェクトは、キーが弱参照されるキーと値のペアのコレクションです。キーはオブジェクトである必要があり、値は任意です。 WeakMap は 4 つのメソッドのみを提供します:
1.delete(key); 根据key删除value
2.get(key);根据key获取value
3.has(key) 根据key检查是不是存在value
4.set(key,value) 根据key设置value

let weakMap=new WeakMap();
weakMap.set('hi','word')  //异常   因为WeakMap的键只能是个对象
let obj1={};
weakMap.set(obj1,'word')  //正常
console.log(weakMap)   //WeakMap {}
console.log(weakMap.get(obj1))  //word
console.log(weakMap.has(obj1))  //true
console.log(weakMap.delete(obj1))  //true
ログイン後にコピー
関連する推奨事項:

ES6 の新機能の詳細な紹介 - JavaScript の Map オブジェクトと WeakMap オブジェクトのコード例


以上がES6 の Map と WeakMap の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート