ES6基础4(数据结构)-学习笔记

本文详细介绍了ES6中Set、Map和Symbol数据结构的基础用法,包括添加、删除、查找、转换及实际应用场景,如数组去重、过滤与集合操作。通过实例演示了如何利用这些数据结构进行高效的数据管理和操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

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

在这里插入图片描述

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
    }

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值