set和map以及for...of的用法

àì夳堔傛蜴生んèń 2022-12-19 01:21 103阅读 0赞

# set和map数据结构 #

故心故心故心故心小故冲啊

--------------------

### 文章目录 ###

*  set和map数据结构
 *  一、set数据结构
 *  二、map数据结构
 *  三、for.of的用法
 *   *  总结

--------------------

# 一、set数据结构 #

//JS数据结构 Array Object Set Map
      var arr1 = new Array();
        var arr2 = [3,4,5,6,7,7,8];
        arr2.push(1);
        arr2[1] = 2;
    
        var obj = new Object();
        var obj2 = { }
        
        var set = new Set();  //类似于数组，成员是唯一的 全等进行匹配
        set.add(4);
        set.add(2);
        set.add(3).add(4).add(5).add('5');
        // {4, 2, 3, 5,'5'}
    
        //另一种定义方式
        var set2 = new Set([3,4,5,6,7,7,8]);
        console.log(set2);  //{3,4,5,6,7,8}
    
      
        //数组去重
        var arr3 = [1,2,1,2,3,4,2,3,4,3,2,3,4,2,3,4,2,5];
        var s = new Set(arr3);  //{1,2,3,4,5}
    
        //es5
        function f(){ 
            var arr = [];
            for(var i = 0;i<arr3.length;i++){ 
                if(arr.indexOf(arr3[i])==-1){   //没有匹配成功
                    arr.push(arr3[i])
                }
            };
            return arr;
        }
        //类型转换
        //1、...扩展运算符
        var arr4 = [...new Set(arr3)];   //[1, 2, 3, 4, 5]
        //2、Array.from()
        var arr5 = Array.from(new Set(arr3))  // [1, 2, 3, 4, 5]
    
        //求出大于20的数据且去重处理
        var arr6 = [10,23,42,23,14,23,42,23,10,55,23,43,42,55,67,42,20,20];
        var x = [...new Set(arr6.filter(v=>v>20))];
        console.log(x);   //[23, 42, 55, 43, 67]
        //分析思路
        //1、求出大于20
        // var max = arr6.filter(function(v){ 
        // return v>20
        // });
        var max = arr6.filter(v=>v>20);    //[23, 42, 23, 23, 42, 23, 55, 23, 43, 42, 55, 67, 42]
        //2、去重
        var y = new Set(max);  //{23, 42, 55, 43, 67}
        //3、类型转换
        Array.from(y);  //[23, 42, 55, 43, 67]
        [...y];
        //4、合并代码
        var x2 = Array.from(new Set(arr6.filter(v=>v>20)));
        var x3 = [...new Set(arr6.filter(v=>v>20))];
    
        //取二组数据的并集，交集，差集且去重
        var a1 = [1,2,3,4,5,6,4,5,6];
        var a2 = [4,5,6,7,8,9,7,8,9];
    
        //并集：
        //1、数组合并
        var merge = [...a1,...a2];
        //2、去重
        var noDuplicate = new Set(merge);
        //3、类型转换
        var a3 = [...noDuplicate];
        //4、合并代码
        var a3 = [...new Set([...a1,...a2])];
    
        //遍历方法
        const set = new Set([2,3,52,3,4,43,3]);
        for(let v of set){ 
                console.log(v)  
        }
        set.forEach((v,i)=>{ 
                console.log(v)
        });

# 二、map数据结构 #

// map 类似于object 键值对
        var m = new Map();
        m.set('key','value');
        m.set('name','jindu').set('a','a');
    
        var o = { id:100};
        m.set(o,'abc');
    
        //另一种添加方式(二维数组的方式添加进来)
        let m1 = new Map([['a',1],['b',2],['c',3],['id',4]]);
    
        // Map实例的属性和方法
        //size属性
        const m = new Map();
        m.set('a','a').set('b','b');
        m.size //2
    
        //set(key, value)
        const m = new Map();
        m.set('qq', '2429462491')        // 键是字符串
        m.set(100, 'jindu')     // 键是数值
        m.set(undefined, 'value')    // 键是 undefined
    
        //get(key) 读取`key`对应的键值，如果找不到`key`，返回`undefined`。
        const m = new Map();
        var a = { id:2};
        m.set(a,'value');
        m.set('name','jindu');
        m.get(a);     //'value' 通过变量a来获取
        m.get('name');   //jindu 通过'name'属性获取
    
        //has(key) 返回一个布尔值，表示某个键是否在当前 Map 对象之中。
        const m = new Map();
        var a = { id:2};
        m.set(a,'value');
        m.set('name','jindu');
    
        m.has('name')  //true
        m.has('a')   //false
        m.has(a)   //true
    
        //delete(key) 删除某个键，返回`true`。如果删除失败，返回`false`。
        const m = new Map();
        var a = { id:2};
        m.set(a,'value');
        m.set('name','jindu');
    
        m.delete('name')  
        m.has('name')  //false
    
        //clear() 清除所有成员，没有返回值。
        const m = new Map();
        var a = { id:2};
        m.set(a,'value');
        m.set('name','jindu');
    
        m.clear();
    
        let m1 = new Map([['a',1],['b',2],['c',3],['id',4]]);
        // Map遍历方法
        for(let [k,v] of m1){ 
            console.log(k);
            console.log(v);
        };
        //keys() //MapIterator {"a", "b", "c", "id"}
        //values() //MapIterator {1, 2, 3, 4}
        //entries() // MapIterator {"a" => 1, "b" => 2, "c" => 3, "id" => 4}
        for(let k of m1.keys()){ 
            console.log(k);
        };
        for(let v of m1.values()){ 
            console.log(v);
        };
    
        //map类型转换
        //1、对象转数组 Object.keys(对象) Object.values(对象)
        var obj = { 'a':1,'b':2,'c':3};
        Object.keys(obj);  //["a", "b", "c"]
        Object.values(obj); //[1, 2, 3]
    
        //2、map类型转数组 keys() values() + 扩展运算符
        let m1 = new Map([['a',1],['b',2],['c',3],['id',4]]);
        [...m1.keys()];  //["a", "b", "c", "id"] 
        [...m1.values()];
        [...m1]; //[['a',1],['b',2],['c',3],['id',4]]
    
        //3、map转对象object for...of 逐一获取
        let m2 = new Map([['a',1],['b',2],['c',3],['id',4]]);
        var o2 = { };
        for(let [k,v] of m2){ 
            o2[k] = v;
        };
        console.log(o2)  //{a: 1, b: 2, c: 3, id: 4}
    
        //4、对象object转map for in 逐一set加进去
        var obj = { 'a':1,'b':2,'c':3};
        let m3 = new Map();
        for(let k in obj){ 
            m3.set(k,obj[k]);
        };
        console.log(m3);
    
        //二种方式 Object.entries(obj) //是一个二维数组
        let m4 = new Map(Object.entries(obj));

# 三、for.of的用法 #

## 总结 ##

**类型转换(重点):**  
  
1、对象转数组 Object.keys(对象) Object.values(对象)  
2、map类型转数组 keys() values() + 扩展运算符  
3、map转对象object for…of 逐一获取  
4、对象object转map for…in 逐一set加进去或者(new Map(Object.entries(obj)))