zoukankan      html  css  js  c++  java
  • 《深入理解ES6》之Set集合与Map集合

    Set集合 

      Set类型是一种有序列表,其中含有一些相互独立的非重复,通过Set集合可以快速访问其中的数据,更有效地追踪各种离散值。

    创建Set集合并添加元素

      调用new Set()创建Set集合,调用add()方法向集合添加元素,访问集合的size属性可以获取集合中目前的元素数量,访问has()方法可以检测Set集合中是否存在某个值。抵用delete()方法可以移除Set集合中的某一个元素,调用clear()方法会移除集合中的所有元素。

    let set=new Set();                           
    set.add(5);                                  
    set.add('5');                                
    set.add(5);                
                      
    console.log(set.size);         //   2,Set有自动去
    console.log(set.has(5));          // true    
    
    set.delete(5);                               
    console.log(set.has(5));           //false   
    
    set.clear();                                 
    console.log(set.size);                //0    

    Set集合的forEach()方法

      forEach()方法的回调函数接受以下3个参数:

    1)Set集合中下一次索引的位置

    2)与第一个参数一样的值

    3)被遍历的Set集合本身

      let set=new Set([1,2]);                          
      set.forEach(function(value,key,ownerSet){        
          console.log(key+''+value);                   
          console.log(ownerSet===set);                 
          //1 1                                        
          //true                                       
          //2 2                                        
          //true                                       

    将Set集合转换成数组

      将数组转换为Set集合的过程很简单,只需给Set构造函数传入数组即可;将Set集合在转回数组的过程同样很简单,可以运用展开运算符(...)

     let set=new Set([1,2,3,3,4,5,6,6]),array=[...set];           
     console.log(set);//[1,2,3,4,5,6]                             

    WeakSet集合

      将对象存储在Set的实例与存储在变量中完全一样,只要Set实例中的引用存在,垃圾回收机制就不能释放该对象的内存空间,这是WeakSet集合可以解决问题。

      用WeakSet构造函数可以创建WeakSet集合,集合支持三种方法:add()、has()、delete()。

    let set=new WeakSet(),                     
        key={};                                
    set.add(key);                              
    console.log(set.has(key));//true 
              
    set.delete(key);                           
    console.log(set.has(key));// false         

    Set与WeakSet的区别

    • 在WeakSet的实例中,如果向add()、has()、delete()这三个方法传入非对象参数都会导致程序报错。
    • WeakSet集合不可迭代,所以不能被用于for-of循环。
    • WeakSet集合不暴露任何迭代器,所以无法通过程序本身来检测其中的内容。
    • WeakSet集合不支持forEach()方法
    • WeakSet集合不支持size属性。

    如果只需要跟踪对象引用,优选WeakSet。

    Map

      Map类型是一种储存着许多键值对的有序列表,其中的键名和对应的值支持所有的数据类型。

    创建Map集合并添加元素

      添加新元素可以调用set()方法并分别传入键名和对应值作为两个参数;如果要从集合中获取信息,可以调用get()方法。

     let map =new Map();                                 
     map.set("title","zhelishi");                        
     map.set("year",2017);                               
                                                         
     console.log(map.get("title"));//'zhelishi'          
     console.log(map.get("year"));//2017                 

    Map集合支持的方法、初始化方法forEach()方法

    • has(key)检测指定的键名在Map集合中是否已经存在
    • delete(key)从集合中移除指定键名及其对应的值
    • clear()移除集合中所有的键值对
    let map=new Map();                                      
    map.set("name","jiaxiaonuo");                           
    map.set("age",24);                                      
    console.log(map.size);//2                               
                                                            
    console.log(map.has("name"));//true                     
    console.log(map.has("age"));//true                      
    console.log(map.get("name"));//"jiaxiaonuo"             
    console.log(map.get("age"));//24                        
                                                            
    map.delete("name");                                     
    console.log(map.has("name"));//false                    
    console.log(map.get("name"));//undefined                
    console.log(map.size);//1                               
                                                            
    map.clear();                                            
    console.log(map.size);//0                               

      初始化Map集合

     let map=new Map([["name","jiaxiaonuo"],["age",24]]);            
     console.log(map.has("name"));//true                             
     console.log(map.get("name"));//jiaxiaonuo                       
     console.log(map.size);//2                                       

      Map集合的forEach()方法接受三个参数:

    • Map集合中下一次索引的位置
    • 值对应的键名
    • Map集合本身
     let map=new Map([["name","jiaxiaonuo"],["age",24]]);     
     map.forEach(function(value,key,owenMap){                 
         console.log(key+''+value);                           
         console.log(owenMap===map);                          
         //name jiaxiaonuo                                    
         //true                                               
         //age 24                                             
         //true                                               
     })                                                       

    WeakMpa集合

      该集合的最大用途是保存Web页面中的DOM元素。它是一种存储着许多键值对的无序列表,列表的键名必须是非null类型的对象,键名对应的值则可以是任意类型。通过set()方法添加数据,通过get()方法获取数据。

     let map=new WeakMap(),                                
        element=document.querySelector(".element");        
     map.set(element,'jiaxiaonuo');                        
     let value=map.get(element);                           
     console.log(value);                      //jiaxiaonuo             
    element.parent().removeChild(element);          
    element=null;      

      该集合支持has()、delete()方法

    let map=new WeakMap(),                       
        element=document.querySelector(".element"
    map.set(element,"jiaxiaonuo");               
                                                 
    console.log(map.has(element));    //true     
    console.log(map.get(element));   //jiaxiaonuo
    map.delete(element);                         
    console.log(map.has(element));  //false      
    console.log(map.get(element));//undefined    

      集合初始化

     let key1={},key2={},                                            
         map=new Map([[key1,"hello"],[key2,"world"]]);               
     console.log(map.has(key1)); //true                              
     console.log(map.get(key1)); //hello                             
     console.log(map.has(key2)); // true                             
     console.log(map.get(key2));//world                              
                                                                     

      当数据再也不可访问后集中存储的相关引用和数据都会被自动回收,这有效地避免了内存泄漏的问题,从而优化了内存的使用。相对Map集合而言,Weak Map集合对用户的可见度更低,气不支持通过forEach()方法、size属性及clear()方法来管理集合中的元素。

  • 相关阅读:
    百度面试题
    京东2014年招聘会成都站笔试经历
    把一个字符串的大写字母放到字符串的后面,各个字符的相对位置不变,不能申请额外的空间
    POJ 2234 Matches Game
    POJ 3903 Stock Exchange
    POJ 2853 Sequence Sum Possibilities
    POJ 3519 Minimal Backgammon
    POJ 2096 Collecting Bugs
    POJ 3071 Football
    HDU 1175 连连看
  • 原文地址:https://www.cnblogs.com/jiaxiaonuo/p/7307837.html
Copyright © 2011-2022 走看看