ES6数据结构 set 和 map

ES6数据结构

本章节概述了es6的新数据结构 set 和 map 的操作方法、遍历方法和用法

set

set是一种新的数据类型,是一个类数组,成员的值都是唯一的,没有重复的值,Set本身是一个构造函数,用来生成Set数据结构。

基本用法
let set = new Set();

set函数可以接受一个数组作为参数,用来初始化:
const set = new Set([‘1’,‘2’,‘3’,‘2’]);
注意:set结构不会接受重复的参数,这也体现了set结构去重的方法

set结构去重:

  1. {
  2. let arr=[12,34,12,34,56];
  3. let set1=new Set(arr);
  4. let res=Array.from(set1); //array.from把类数组变成数组
  5. // let res=[...set1]; //扩展运算符可以把类数组变成数组
  6. console.log(res); //[12,34,56]
  7. }

在set结构中,两个对象总是不相等的,NaN也等于其本身。

set结构的属性和方法:

(1)Set 结构的实例属性:

  1. set.prototype.constructor:构造函数,默认就是Set函数。
  2. set.prototype.size:返回Set实例的成员总数。

(2) set 实例的方法分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员)。

操作方法

  • add(value):添加某个值,返回 Set 结构本身(类数组)。
  • delete(value):删除某个值,返回一个布尔值,表示删除是否成功。
  • has(value):返回一个布尔值,表示该值是否为Set的成员。
  • clear():清除所有成员,没有返回值。

    //add
    let arr=[12,34,12,34,56];
    let set1=new Set(arr);
    console.log(set1.add(“aaa”)); //{ 12, 34, 56, “aaa”}

    //delete
    set1.delete(12);
    console.log(set1); //{ 34, 56, “aaa”}

    //has
    console.log( set1.has(“aaa”)); //true

    //clear
    set1.clear();
    console.log(set1); //{ }

遍历方法

forEach() 使用回调函数遍历每个成员
Set的遍历顺序就是插入顺序,这个特性有时非常有用,比如使用 Set 保存一个回调函数列表,调用时就能保证按照添加顺序调用。
forEach遍历的时候不能拿到下标

  1. let arr=[12,34,12,34,56];
  2. let set1=new Set(arr);
  3. set1.forEach((item)=>{
  4. console.log(item); //12,34,56
  5. })

map

map结构是一种类似于json 的结构 , 跟json 的区别就是 json的key值只能是字符串 , map的key值可以是任何类型

实例的属性和操作方法

(1)size 属性

  1. size属性返回 Map 结构的成员总数。
  2. const map = new Map();
  3. map.set('foo', true);
  4. map.set('bar', false);
  5. map.size // 2

(2)实例操作方法

  • set(key, value) 设置键名key对应的键值为value,然后返回整个 Map 结构。如果key已经有值,则键值会被更新,否则就新生成该键。
  • get(key) 读取key对应的键值,如果找不到key,返回undefined。
  • has(key) 返回一个布尔值,表示某个键是否在当前 Map 对象之中。
  • delete(key) 删除某个键,返回true。如果删除失败,返回false。
  • clear() 清除所有成员,没有返回值。

只能通过set方法和get方法设置值和获取值

  1. //set
  2. const m = new Map();
  3. m.set('edition', 6); // 键是字符串
  4. m.set(262, 'standard'); // 键是数值
  5. m.set(undefined, 'nah'); // 键是 undefined
  6. //set方法返回的是当前的Map对象,因此可以采用链式写法。
  7. let map = new Map().set(1, 'a').set(2, 'b').set(3, 'c');
  8. //get
  9. const m = new Map();
  10. const hello = function() { console.log('hello');};
  11. m.set(hello, 'Hello ES6!'); // 键是函数
  12. m.get(hello); // Hello ES6!
  13. //has
  14. const m = new Map();
  15. m.set('edition', 6);
  16. m.has('edition'); // true
  17. m.has('years'); // false
  18. //delete
  19. const m = new Map();
  20. m.set(undefined, 'nah');
  21. m.has(undefined); // true
  22. m.delete(undefined);
  23. m.has(undefined); // false
  24. //clear
  25. clear方法
  26. let map = new Map();
  27. map.set('foo', true);
  28. map.set('bar', false);
  29. map.size; // 2
  30. map.clear();
  31. map.size; // 0

(3)遍历方法

  • keys():返回键名的遍历器,拿到所有键值进行循环使用
  • values():返回键值的遍历器。
  • forEach():遍历 Map 的所有成员。

需要特别注意的是,Map 的遍历顺序就是插入顺序 , item是value值 , key是键值。

  1. let fun1=()=>{
  2. console.log(111);
  3. }
  4. let map1=new Map()
  5. map1.set(2,"aa");
  6. map1.set(fun1,"bb");
  7. //keys
  8. for(var item of map1.keys()){
  9. console.log(item);
  10. }
  11. //forEach
  12. map1.forEach((item,key)=>{
  13. console.log(item,key); //aa 2 和 bb ()=>{console.log(111)}
  14. })
  15. // foreach可以循环map结构 item是value值 key是键值

发表评论

表情:
评论列表 (有 0 条评论,23人围观)

还没有评论,来说两句吧...

相关阅读