ES6中map和set用法

时间：2023-01-09 14:27:52

ES6中map和set用法

--转载自廖雪峰的官方网站

一、map

Map是一组键值对的结构，具有极快的查找速度。

举个例子，假设要根据同学的名字查找对应的成绩，如果用Array实现，需要两个Array：
var names = ['Michael', 'Bob', 'Tracy'];
var scores = [95, 75, 85];
给定一个名字，要查找对应的成绩，就先要在names中找到对应的位置，再从scores取出对应的成绩，Array越长，耗时越长。

或者通过object键值对的方式来实现存储和查找：
var names = Object.create({'Michael':95,'Bob':75,'Tracy':85});
但是如果这个表十分庞大的时候，查询速度也是很感人的。

所以ES6提供了map方法来提高查询的速度，如果用Map实现，只需要一个“名字”-“成绩”的对照表，直接根据名字查找成绩，无论这个表有多大，查找速度都不会变慢。如果用Map实现，只需要一个“名字”-“成绩”的对照表，直接根据名字查找成绩，无论这个表有多大，查找速度都不会变慢。

var m=new Map();
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);
console.log(m);//Map { 'Adam' => 67, 'Bob' => 59 }
console.log(m.has('Adam')); // 是否存在key 'Adam': true
console.log(m.get('Adam')); // 67
console.log(m.delete('Adam')); // 删除key 'Adam':true
console.log(m.get('Adam')); // undefined

ES6中Map相对于Object对象有几个区别：

  1. Object对象有原型， 也就是说他有默认的key值在对象上面， 除非我们使用Object.create(null)创建一个没有原型的对象；

  2. 在Object对象中， 只能把String和Symbol作为key值， 但是在Map中，key值可以是任何基本类型(String, Number, Boolean, undefined, NaN….)，或者对象(Map, Set, Object, Function , Symbol , null….);

  3. 通过Map中的size属性， 可以很方便地获取到Map长度， 要获取Object的长度， 你只能用别的方法了；
    　　Map实例对象的key值可以为一个数组或者一个对象，或者一个函数，比较随意 ，而且Map对象实例中数据的排序是根据用户push的顺序进行排序的， 而Object实例中key,value的顺序就是有些规律了， (他们会先排数字开头的key值，然后才是字符串开头的key值)；

二、set

Set和Map类似，也是一组key的集合，但不存储value。由于key不能重复，所以，在Set中，没有重复的key。

要创建一个Set，需要提供一个Array作为输入：

var arr=[1,2,3,3,'3'];
var s1=new Set(arr);
console.log(s1);//Set { 1, 2, 3, '3' }
s1.add(4);//重复添加无用
console.log(s1);//Set { 1, 2, 3, '3', 4 }
s1.delete(4);
console.log(s1);//Set { 1, 2, 3, '3' }

感觉set的用法可以有两个地方

  1. 因为key不能重复，所以可以用来去掉array中的重复元素。

    'use strict';
    // var set = new Set([1,2,1,2,2,1]);
    var arr = [1,2,1,2,2,1];
    //new Set 数组去重
    function unique(arr){
    return Array.from(new Set(arr));
    };
    //使用ES6的方法可以去重.
    console.log(unique(arr));

  2. 可以用来统计键（这个暂时还没想到应用场景）

小结

Map和Set是ES6标准新增的数据类型，请根据浏览器的支持情况决定是否要使用。

相关文章