前端学习（五十二） JavaScript-KeyedCollection（javaScript）

主要是Map和weakMap，Set和WeakSet

Map

是ES6中新定义的对象，和Object一样是一个键值的集合

new Map([iterable])新建一个Map对象，参数iterable是一个由键值对数组组成的参数

var a=new Map([
    ['tee','net'],
    ['hoodie','net']
])
console.log(a)   //输出了map对象
console.log(a.constructor);  //输出了map构造函数

这边Map里键值key不能重复，如果重复了那么后面的会覆盖前面的，例如有两个tee，那么后面一个tee的会覆盖到前面一个去，并且值为后面一个

Map和Obejct的区别

Object	Map
键值只能是字符串或者Symbols	键值可以使任意值
需要通过for....in语句手动获得键值对个数	可以通过size属性获得键值对个数

Map的原型方法

Map.prototype.set(key,value)

设置Map对象中键的值，返回该Map对象，key就是要设置的名称，如果map中没有，那么会新增一个，如果有那么就是会修改其值为value

var a=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
a.set("tee","test")
console.log(a);   //输出会将tee的值改为test

Map.prototype.get(key)

返回键对应的值，如果不存在，则返回Underfined，key为键名

var a=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
console.log(a.get("tee"))  //输出net
console.log(a.get("ddd"))  //undefined

Map.prototype.has(key)

返回一个布尔值，表示Map实例中是否包含键对应的值，key为键名

var a=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
console.log(a.has("tee"))  //true
console.log(a.has("ddd"))  //false

Map.prototype.delete(key)

移除任何与键相关联的值，并返回该值，key为键名

var b=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
console.log(b.delete("aaa"))    //false
console.log(b.delete("tee"))    //true
console.log(b)  //返回了Map对象b，但是tee没有了

Map.prototype.clear()

移除Map对象的所有键/值

var c=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
console.log(c.clear())    //undefined
console.log(c)  //空对象

Map.prototype.entries()

返回一个新的iterator对象，它按插入顺序包含了Map对象中每个元素的[key,value]数组

var d=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
console.log(d.entries())    //MapIterator {"tee" => "net", "hoodie" => "net", "asd" => "n123et"}
console.log(d)  //Map(3) {"tee" => "net", "hoodie" => "net", "asd" => "n123et"}

个人理解差不多就是新建了一个iterator对象，然后将原来对象中的内容复制按顺序到新对象里

Map.prototype.forEach(callbcakFn[,thisArg])

按插入顺序，为Map对象里的每一键值对调用一次回调函数

callbackFn：要处理的函数，函数有三个参数value，key，Map

value：元素的值
key：元素的键
Map：当前正在遍历的对象

thisArg：执行forEach时的用于this的值，可选

var f=new Map([
    ['tee','nettee'],
    ['hoodie','nethoo'],
    ['asd','n123et']
])
var con={
    val:function (value) {
        return value+1
    },
    out:function (value,key) {
        console.log(this.val(value))  //输出：nettee1，nethoo1,n123et1
    }
}
f.forEach(con.out,con)

Map.prototype.keys()

返回一个新的iterator对象，它按插入数序包含了Map对象中每个元素的键也就是key

var e=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
console.log(e.keys())    //MapIterator {"tee", "hoodie", "asd"}
console.log(e)  //Map(3) {"tee" => "net", "hoodie" => "net", "asd" => "n123et"}

Map.prototype.values()

返回一个新的iterator对象，它按插入数序包含了Map对象中每个元素的值，也就是value

var g=new Map([
    ['tee','net'],
    ['hoodie','net'],
    ['asd','n123et']
])
console.log(g.values())    //MapIterator {"net", "net", "n123et"}
console.log(g)  //Map(3) {"tee" => "net", "hoodie" => "net", "asd" => "n123et"}

WeakMap

WeakMap也是一个键值对的集合，但是其中的键是弱引用的,这意味着,如果没有其他引用和该键引用同一个对象,这个对象将会被当作垃圾回收，键必须是对象，值可以是任意的

构造WeakMap对象

new WeakMap(iterable)

var a={a:1};
var weak=new WeakMap([
    [a,"123"]
])
console.log(weak) //返回一个WeakMap对象
console.log(weak.constructor)   //输出weak构造函数

WeakMap和Map的区别

WeakMap	Map
键名只能是对象	键名可以是任意值
键名所指的对象，不计入垃圾回收机制	计入垃圾回收机制
键名是非枚举	键名可以枚举

WeakMap原型方法

WeakMap.prototype.set(key,value)

设置WeakMap对象中键的值，返回该WeakMap对象，key就是要设置的对象名称，如果这个对象不存在，那么会报错，如果对象存在且WeakMap中没有，那么会新增一个，如果有那么就是会修改其值为value

var a={a:1};
var b={b:1};
var weak=new WeakMap([
    [a,"123"]
])
console.log(weak.set(b,"999"))    //新增一个b，这个b必须是定义过的，不存在会报错
console.log(weak.set(a,"999"))    //修改对象a的值

WeakMap.prototype.get(key)

返回键对应的值，注意这边的b必须是定义过的，如果b没有定义过且又不存在对象中则会报错，key为键名

    var a={a:1};
    var b={};
    var weak=new WeakMap([
        [a,"123"],
    ])

    console.log(weak.get(b));  //返回undefined

WeakMap.prototype.has(key)

返回一个布尔值，表示Map实例中是否包含键对应的值，key为键名

    var a={a:1};
    var b={};
    var weak=new WeakMap([
        [a,"123"],
    ])

    console.log(weak.has(b));  /false

WeakMap.prototype.delete(key)

移除任何与键相关联的值，并返回该值，key为键名

    var a={a:1};
    var b={};
    var weak=new WeakMap([
        [a,"123"],
    ])

    console.log(weak.delete(b));
    console.log(weak);

console.log(b)  //返回了Map对象b，但是tee没有了

用WeakMap的好处就是不会出现内存泄漏，内存泄漏还没有讲，待理解后再来补齐这边的文档

Set

Set是ES6中新增的一个数据结构，它类似于数组，但是成员值都是唯一的

创建

new Set([iterable])

可以按照插入的顺序迭代它的元素
Set结构不会添加重复的值

var a=new Set([1,2,3,4,5,5])
console.log(a)    //输出：1，2，3，4，5，重复的不显示

set的原型方法

Set.prototype.add(value)

在set对象的尾部添加一个元素，返回该Set对象

Set.prototype.has(value)

返回一个布尔值，表示该值在Set中存在与否

Set.prototype.delete(value)

移除Set中与这个值相等的元素

Set.prototype.clear()

移除Set对象内所有元素

Set.prototype.entries()

返回一个新的迭代器对象，该对象包含了Set对象中插入顺序排列的所有元素的值的[key，value]数组

Set.prototype.forEach(回调函数[,thisArg])

按照插入栓需，为Set对象中的每一个值调用一次回调函数

Set.rpototype.values()

返回一个新的迭代器对象，包含了Set对象中的按插入顺序排列元素的所有元素的值

Set.pototype.keys()

返回一个新的迭代器对象，包含了Set对象中的按插入顺序排列元素的所有元素的key

WeakSet

和set类似，是不重复值的集合

创建

new WeakSet([iterable])

var ex={}
var a=new WeakSet([ex])

WeakSet	set
键名只能是对象	键名可以是任意值
键名所指向的对象，不进入垃圾回收机制	计入垃圾回收机智

原型方法

WeakSet.prototype.add(value)

在WeakSet对象的尾部添加一个元素，返回该Set对象

WeakSet.prototype.has(value)

返回一个布尔值，表示该值在Set中存在与否

WeakSet.prototype.delete(value)

移除WeakSet中与这个值相等的元素

WeakSet.prototype.clear()

移除WeakSet对象内所有元素

前端学习（五十二） JavaScript-KeyedCollection（javaScript）

猜你喜欢