es6之(set和map结构)使用方法

155 阅读3分钟

什么set?请你说一下set数据结构

es6 提供了新的数据结构
特性 类似数组但是成员的值是唯一的(禁止重复) 没有重复的值向Set加入值的时候不会发生类型转换
set 本身是一个构造函数 用来生成 set数据结构与数组配合使用

下面的方法(操作方法)
  const s = new Set()
  s.add(1)                  //添加一个值 返回set本身               //添加数据
  s.delete(value 删除的值 ) //删除某个值  返回布尔类型  表示是否删除本身
  s.has(value)              //返回一个布尔 表示value是否是set 成员//查找有没有数据
  s.clear(value)            //直接清除所有的数据 没有返回值
  s.size()                  //同类似lenght指长度                  //重复不算
  s.keys() values()         //两个相同  都是i
    const s = new Set();
    [1,2,3,4,5,5,5,5,].forEach(x => s.add(x));//在这里 通过add方法结构加入成员 结果表明set不会添加重复的值 
    for(let i of s){
        console.log(i);
    }
    //Set结构的实例与数据一样 也拥有forEach方法。用于对每一个成员执行某种操作
    s.forEach(e=>{
       console.log(e)               //1,2,3,4,5
    })
    //实现一个数组去重
    var arr = [1,2,2,2,2,1,2,3]
    console.log([...new Set(arr)])  //1,2,3            
    //set函数还可以接收 一个数组 作为参数 用来初始化
    const set = new Set([1,2,3,4,4,4])
    console.log([...set])           //1,2,3,4
    //不会计算重复的值 size似length
    const items = new Set([1,2,3,4,4,4,4])
    console.log(items.size)         //4

demo一个

 var set = new Set()
    set.add(1);
    set.add(2);
    set.add(3);
    set.add(4);
    set.add(4);
    //set.delete(1); //删除掉1 
    console.log(set)       // {1,2,3}
    console.log(set.has(1)) //true 有返回真 没有返回假
    console.log(set.has(5)) //false 
    console.log(set.size)   //3 
    console.log(set.values()) //输出i  
    for(var i of set.values()){
        console.log(i)        // 1 2 3
    }   
    
    //arr 去重
    var arr = [1,2,3,4,5]
    var arr2 = [1,2,3,4,5,6,7,7]
    var set =new Set([...arr,...arr2])     
    console.log(set)       //{1, 2, 3, 4, 5, …}
    var arr3 = [...set]
    console.log(arr3)       // [1, 2, 3, 4, 5, 6, 7]
循环操作(便利方法)

set结构的实例 有4个便利方法 可以用于便利成员
keys() 返回遍历键名的
valuse() 返回键值得
entries() 返回键值对的
forEach() 使用回调函数循环每个成员的

  //这三个方法都是循环数组 搭配for...of使用  
    //区别是 keys是对键名的循环   values是对键值的循环   entires是对键值对儿的循环 
    for(let index of [a,b].keys()){
        console.log(index);
    }    
    // 0 1 
    for(let elem of [a,b].values()){
        console.log(elem)
    }
    // a b 
    for(let [index,elem] of [a,b].entries()){
        console.log(index,elem)
    }
    //0 "a"
    //1 "b"
使用set 可以很容易的实现 数组的 并集 交际 差集
    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 jj = new Set([...a].filter(x=>b.has(x)))
    //set [2,3]
    //差集 
    let cj = new Set([...a].filter(x=>!b.has(X)));

关于map

与json配合使用无敌
josn & map 都是键值对儿 不能存重复的key会覆盖
set() 设置值
get("key") 拿它的key取它的value

 var mapNode = new Map()
    mapNode.set("王帅",'脑子瘸了')
    mapNode.set("晓芳","200kg")
    console.log(mapNode)    //{"王帅" => "脑子瘸了"}
                            //{"王帅" => "脑子瘸了", "晓芳" => "200kg"}
    console.log(mapNode.get("晓芳")) //200kg

    for(let [k,v] of mapNode){
        console.log(k,v)        
    }
                            //王帅  脑子瘸了    晓芳   200kg
面试题?map与es5的json有什么区别?

在es5中 只能用字符串作为键 (带来了限制)
Map数据存在 键 - 值;且键可以是 任意类型(弥补了ES5中对象的键只能是字符串)