ES 6ノート-セットとMapデータ構造

阮一峰ES 6教程によって摘出される可能性のある特性
セットデータ構造
        配列に似ていますが、メンバー値はすべて唯一で、new set()によって作成されます.
属性

Set.prototype.constructor:コンストラクタ、デフォルトはSet関数です.

Set.prototype.size:Setの例のメンバの総数を返します.

操作方法

add(value):ある値を追加して、Set構造自体に戻る.

delete(value):ある値を削除し、ブール値を返し、削除が成功したかどうかを示す.

has(value)は、Setのメンバであるかどうかを示すブール値を返します.

clear():全員をクリアし、戻り値がない.

let s = new Set()
s.add(1).add(2).add(2);
//   2      

s.size // 2

s.has(1) // true
s.has(2) // true
s.has(3) // false

s.delete(2);
s.has(2) // false

巡回方法
        Setの巡回順序は挿入順序です.        Setはキー名がないので、keys()とvalues()の方法は同じです.

keys():キーパッドに戻るエルゴード

values():キー値を返すエルゴード

entries():キーパッドペアに戻るエルゴード

forEach():コールバック関数を使用して、各メンバを巡回しても良いし、第二のパラメータを使用して、thisオブジェクト

を指定しても良い.

let set = new Set(['red', 'green', 'blue']);

for (let item of set.keys()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.values()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.entries()) {
  console.log(item);
}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]

set = new Set([1,4,9]);
set.forEach((value,key) => console.log(`${key}:${value}`))
//1:1
//4:4
//9:9

アプリケーションを巡回
        配列

let arr = [3, 5, 2, 2, 5, 5];
let unique = [...new Set(arr)];
// [3, 5, 2]

        間接的にmap、filterの方法を使います.

let set = new Set([1, 2, 3]);
set = new Set([...set].map(x => x * 2));
//   Set  ：{2, 4, 6}

let set = new Set([1, 2, 3, 4, 5]);
set = new Set([...set].filter(x => (x % 2) == 0));
//   Set  ：{2, 4}

        集合、交差、差集合を実現する.

let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);

//   
let union = new Set([...a, ...b]);
// Set {1, 2, 3, 4}

//   
let intersect = new Set([...a].filter(x => b.has(x)));
// set {2, 3}

//   
let difference = new Set([...a].filter(x => !b.has(x)));
// Set {1}

ウェストセット
        Setに似ていますが、メンバーはオブジェクトだけです.        弱アプリケーション、メモリリークリスクなし        アクセス属性がないが、add、delete、hasメソッドがあります.
Mapデータ構造
        ES 5のオブジェクトは文字列のみをキーとし、Map構造は各種類の値(オブジェクトを含む)をキーとし、MapはObjectよりも適切です.        mapのキーは実際にメモリアドレスと紐付けられています.値とは関係ありません.

const map = new Map([
  ['name', '  '],
  ['title', 'Author']
]);

map.size // 2
map.has('name') // true
map.get('name') // "  "
map.has('title') // true
map.get('title') // "Author"

属性
    size属性は、Map構造のメンバー総数に戻る.
操作方法
    set(key,value)は現在のmapオブジェクトに戻り、チェーンで書くことができます.

const m = new Map();

m.set('edition', 6)        //      
m.set(262, 'standard')     //     
m.set(undefined, 'nah')    //    undefined

let map = new Map()
  .set(1, 'a')
  .set(2, 'b')
  .set(3, 'c');

    キー(key)は、keyに対応するキーを得る.

const m = new Map();

const hello = function() {console.log('hello');};
m.set(hello, 'Hello ES6!') //     

m.get(hello)  // Hello ES6!

    has(key)キーはMapオブジェクトにありますか?

const m = new Map();

m.set('edition', 6)
 .set(262, 'standard')
 .set(undefined, 'nah');

m.has('edition')     // true
m.has('years')       // false
m.has(262)           // true
m.has(undefined)     // true

    delete(key)はあるキーを削除して、成功したらtrueに戻ります.失敗false

const m = new Map();
m.set(undefined, 'nah');
m.has(undefined)     // true

m.delete(undefined)
m.has(undefined)       // false

    clear()は全員をクリアし、戻り値なし

let map = new Map();
map.set('foo', true);
map.set('bar', false);

map.size // 2
map.clear()
map.size // 0

巡回方法、
        巡回順序は挿入順序です.

keys():キーのエルゴードを返す.

values():キーパッドのエルゴードを返す.

entries():全メンバーのエルゴードを返す.

forEach():Mapの全メンバーを巡回しました.

const map = new Map([
  ['F', 'no'],
  ['T',  'yes'],
]);

for (let key of map.keys()) {
  console.log(key);
}
// "F"
// "T"

for (let value of map.values()) {
  console.log(value);
}
// "no"
// "yes"

for (let item of map.entries()) {
  console.log(item[0], item[1]);
}
// "F" "no"
// "T" "yes"

//   
for (let [key, value] of map.entries()) {
  console.log(key, value);
}
// "F" "no"
// "T" "yes"

//      map.entries()
for (let [key, value] of map) {
  console.log(key, value);
}
// "F" "no"
// "T" "yes"

適用
    配列mapと結合して、filter方法はMapのエルゴードとフィルタリングを実現します.

const map0 = new Map()
  .set(1, 'a')
  .set(2, 'b')
  .set(3, 'c');

const map1 = new Map(
  [...map0].filter(([k, v]) => k < 3)
);
//    Map    {1 => 'a', 2 => 'b'}

const map2 = new Map(
  [...map0].map(([k, v]) => [k * 2, '_' + v])
    );
//    Map    {2 => '_a', 4 => '_b', 6 => '_c'}

       forEachメソッド

const reporter = {
  report: function(key, value) {
    console.log("Key: %s, Value: %s", key, value);
  }
};

map.forEach(function(value, key, map) {
  this.report(key, value);
}, reporter);

データ構造間の相互変換
    Mapを行列に変換

const myMap = new Map()
  .set(true, 7)
  .set({foo: 3}, ['abc']);
[...myMap]
// [ [ true, 7 ], [ { foo: 3 }, [ 'abc' ] ] ]

    配列をMapに変換

new Map([
  [true, 7],
  [{foo: 3}, ['abc']]
])

    Mapをオブジェクトに変換

function strMapToObj(strMap) {
  let obj = Object.create(null);
  for (let [k,v] of strMap) {
    obj[k] = v;
  }
  return obj;
}

const myMap = new Map()
  .set('yes', true)
  .set('no', false);
strMapToObj(myMap)
// { yes: true, no: false }

    オブジェクトをMapに変換

function objToStrMap(obj) {
  let strMap = new Map();
  for (let k of Object.keys(obj)) {
    strMap.set(k, obj[k]);
  }
  return strMap;
}

objToStrMap({yes: true, no: false})
// Map {"yes" => true, "no" => false}

WeakMap
    Mapに似ていますが、キーはオブジェクトのみとなります.    WeakMapのキーが指す対象はゴミ回収機構に計上しない(メモリ漏れなし)
    操作を巡回していませんが、set、get、has、deleteの方法があります.
    適用
        私たちはこの状態をキーとしてWeakMapに置き、対応するキー名はmyElementです.このDOMノードが削除されると、この状態は自動的に消え、メモリ漏れのリスクがない.

let myElement = document.getElementById('logo');
let myWeakmap = new WeakMap();

myWeakmap.set(myElement, {timesClicked: 0});

myElement.addEventListener('click', function() {
  let logoData = myWeakmap.get(myElement);
  logoData.timesClicked++;
}, false);