ES6基础4（数据结构）-学习笔记

蔚落 2022-10-19 05:30 184阅读 0赞

### 文章目录 ###

*   *  ES6基础4（数据结构）-学习笔记
     *   *  set
         *  map
         *  symbol

## ES6基础4（数据结构）-学习笔记 ##

### set ###

//set 数据结构 类似数组 成员信息唯一性
         var s = new Set();
         //添加数据 add()
         s.add(1).add('2').add(2);
         //添加数据 另一种写法
         var s2 = new Set([1,2,3,4,5]);
         var arr = [1,2,3,4,5];
         var s3 = new Set(arr);
    
         //删除 delete() 按名称来删除 返回true false
         var s2 = new Set([1,'2',2,3,4,5]);
         s2.delete('2');
    
         //删除所有 clear() 没有返回值
    
         //has() 匹配是否存在 返回true false 按名称来匹配
         var s2 = new Set([1,'2','a',3,4,5]);
         //s2.has('2'); 
         var a = 'a';
         if(s2.has(a)){ 
             console.log('ok')
         }else { 
            console.log('error')
         };
    
         //属性 size 长度
         var s2 = new Set([1,'2','a',3,4,5]);
         console.log(s2.size)   //6
         
    
         //数组去重
         var s5 = [1,2,2,4,5,4,6,3,6,3,6,7,3,3,5,4,3,6,7,3];
         //es6
         var a = [...new Set(s5)];
         //es5
         function f(){ 
             var a = [];
             for(var i=0;i<s5.length;i++){ 
                 if(a.indexOf(s5[i])==-1){  //没有匹配成功
                    a.push(s5[i])
                 }  
             };
             return a;
         }
         f();
         //es5 另一种方式
         function f2(){ 
            for(var i=0;i<s5.length;i++){ 
               for(var j=i+1;j<s5.length;j++){ 
                    if(s5[i]==s5[j]){ 
                        s5.splice(j,1);
                        j--;
                    }
               }
            };
            return s5;
        }
        f2();
    
        //类型转换
        //set 转 数组
        var s5 = [1,2,2,4,5,4,6,3,6,3,6,7,3,3,5,4,3,6,7,3];
        var a = [...new Set(s5)];
        var a2 = Array.from(new Set(s5))
    
    
        //扩展
        //求出大于100的数据且去重
        var arr = [20,32,23,15,63,543,24,26,3,266,34,246,242,22,123,123,266,246,345,234,123];
        //分析
        //1、求出大于100
        var a = arr.filter(item=>item>100);
        //2、去重
        var b = new Set(a);
        //3、类型转换
        //[...b]
        //Array.from(b)
        //简化
        var c = [...new Set(arr.filter(item=>item>100))];
        var c = Array.from(new Set(arr.filter(item=>item>100)));
    
        // var a = arr.filter(function(item,index){ 
        // return item >100
        // });
        // var a = arr.filter(item=> item >100)
    
        //求二组数据的 并集 交集 差集
        var arr1 =[2,3,5,2,5,7,3,5,36,4];
        var arr2 = [8,9,4,1,2,3,7,3];
        
        //并集 且去重
        var a = [...new Set([...arr1,...arr2])];
        
        //交集
        //分析
        //var a = arr1.filter(function(item){ 
    	// return arr2.indexOf(item)!=-1;
    	// return new Set(arr2).has(item);
    	//})
    	var a = [...new Set(arr1.filter(item=>arr2.indexOf(item)!=-1))]; //法1
    	var a = [...new Set(arr1.filter(item=>new Set(arr2).has(item)))]; //法2
    	
    	//差集
    	var a = [...new Set(arr1.filter(item=>!new Set(arr2).has(item)))]; //法2

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hoaG1vbmtleQ_size_16_color_FFFFFF_t_70]

### map ###

//Map 类似于object 键值对 map的键是可以是其它的类型
         var m = new Map();
         //添加
         m.set('name','abc').set('id',1);
         var a = { msg:'abc'};
         m.set(a,'11111');
         m.get(a);  // 11111
    
         //方法和属性
        // set(); //添加
        // get(); //获取
        // has(); //是否匹配
        // delete(); //删除单个 m.delete("id")
        // clear(); //删除全部
        // size //长度
         
        添加数据 另一种写法
        var m = new Map([['a',1],['b',2],['c',3]]);
        //循环 for...of 替代for ...in forEach()
        //可循环是array set map 但不能是object
        // keys()：返回键名的遍历器 m.keys() //abc
        // values()：返回键值的遍历器 m.values() // 123
        // entries()：返回键值对的遍历器
        for(var v of m.keys()){ 
            console.log(v)
        };
        for(var v of m.values()){ 
            console.log(v)
        }
        for(var [k,v] of m){ 
            console.log(v)
        }
    
        //类型转换
        //Object转数组
        var obj = { 'a':1,'b':2,'c':3};
        //[a,b,c] [1,2,3]
        Object.keys(obj);   //es5 [a,b,c] 
        Object.values(obj);   //es5 [1,2,3]
    
        //map转数组
        var m = new Map([['a',1],['b',2],['c',3]]);
        [...m.keys()] ;//["a", "b", "c"]
        [...m.values()];
        [...m]; //[['a',1],['b',2],['c',3]]
    
        //map转为object
        var m = new Map([['a',1],['b',2],['c',3]]);
        var obj2 = { };
        for(let [k,v] of m){    //k=====a b c | v==== 1,2,3
            obj2[k] = v;  //obj2['a'] = 1 | obj2['b'] = 2
        };
        console.log(obj2)   //{a: 1, b: 2, c: 3}
    
        //object 转为 map
        var obj3 = { a: 1, b: 2, c: 3};
        var m2 = new Map();
        for(let k in obj3){ 
            m2.set(k,obj3[k])
        };
        console.log(m2)

### symbol ###

//symbol es6 引入的新的类型 表示独一无二的值
         //如果添加的属性名出现重复，如何保证属性名的唯一性，解决属性名的冲突
         var obj = { id:1,id:2,id:3,name:123};
         console.log(obj)   //{id:3,name:123}
        //声明
        var s = Symbol();
        console.log(s);
        //独一无二的值
        var s2 = Symbol();
        var s3 = Symbol();
        console.log(s2==s3);  //false
    
        //可以接受一个字符串作为参数 symbol的值
        var s2 = Symbol('name');  
        var s3 = Symbol('name');
        console.log(s2==s3); //false
    
        //symbol定义一个名称，可以通过名称来获取
        var x = Symbol.for('x');   
        var x2 =  Symbol('x');  
        Symbol.keyFor(x);
        Symbol.keyFor(x2)
    
        //实际的应用
        var o = { };
        var s4 = Symbol();
        o[s4] = 'abc';
        console.loe(o)
    
        //第二种写法
        var o = { 
            [s4]:'xyz'
        }
    
        //demo
        var a = Symbol();
        var o ={ 
            [a] :100,
            a:200
        };
        o.a;  //200
        o['a'];//200
        o[a]; //100
    
        var _name = Symbol('name');
        var _age = Symbol();
        var o = { 
            [_name]:200,
            [_age]:100,
            c:200,
            d:100
        };
        // o[_name];
        // o[_age];
        Object.keys(o)  //[c,d]
        //注意 Object.keys for...in 不支持
        for(let k in o ){ 
            console.log(k)   //c,d
        }

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hoaG1vbmtleQ_size_16_color_FFFFFF_t_70 1]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hoaG1vbmtleQ_size_16_color_FFFFFF_t_70]: /images/20221005/391860ef008f4fba83fbcaf261c11bc4.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hoaG1vbmtleQ_size_16_color_FFFFFF_t_70 1]: /images/20221005/456d293acae64392b0ae3f1fb9bf6bba.png