es6 基础语法—set和map

1、set 数据集合
这里写图片描述

//1、创建一个集合  
let set = new Set(['张三','李四','王五']);  
console.log(set);  

//2、一个属性  
//size属性求集合长度  
console.log(set.size);  

//3、四个方法  
//add  
console.log(set.add('henry').add('buck'));  

//delete  
set.delete('张三');  
console.log(set);  

//has 判断是否拥有某个元素  
console.log(set.has('henry'));  

//clear 清除集合里所有东西  
set.clear();  
console.log(set);

运行结果:
这里写图片描述

//keys values  
console.log(set.keys());  
console.log(set.values()); 

这里写图片描述

2、map 数据集合
这里写图片描述
① 对象“键”的局限性

<script>             
     let obj1 = {a:1}, obj2 = {b:2}, obj = {};  
     //给boj空对象添加东西  
     obj.name = "henry";  
     obj[obj1] = "buky";  
     console.log(obj);             
 </script>  

结果:
这里写图片描述

    //接着给obj对象添加东西  
    obj[obj2] = "jenny";  
    console.log(obj); 

结果覆盖了之前添加的东西:
这里写图片描述
这是因为对象“键”的是只局限于字符串的,无论键传入什么类型,都会通过 toString()方法转为字符串。

<script>
     // 验证:  
     console.log(obj1.toString());  
     console.log(obj2.toString());  
     console.log(obj1.toString() === obj2.toString());  
</script>

运行:
这里写图片描述
② map “键”的多样性

     //1、创建map  
     const map = new Map([  
                     ['name','henry'],  
                     ['age',25],  
                     ['sex','男']  
        ])  
    console.log(map); 

运行:
这里写图片描述
验证 map “键”的多样性:

        //1、创建map  
        let obj1 = {a:1}, obj2 = {b:2}  
        const map = new Map([  
            ['name','henry'],  
            ['age',25],  
            ['sex','男'],  
            [obj1,'map键可以是对象'],  
            [obj2,'因此不会覆盖上一个数据'],  
            [[1,2],'map键还可以是数组']  
        ])  
        console.log(map); 

运行:
这里写图片描述
因此, map 是一种更加完善的数据结构。

③ map的属性

size计算长度

console.log(map.size);  

这里写图片描述
去重:

let obj1 = {a:1}, obj2 = {b:2}  
        const map = new Map([  
            ['name','henry'],  
            ['age',25],  
            ['sex','男'],  
            [obj1,'map键可以是对象'],  
            [obj2,'因此不会覆盖上一个数据'],  
            [[1,2],'map键还可以是数组'],  
            ['name','buck'],  
            ['age',28]  
        ])  
        console.log(map);  
        console.log(map.size);  

运行:
这里写图片描述
④常用方法:

set设置、get获取:

let obj1 = {a:1}, obj2 = {b:2}  
    const map = new Map([  
        ['name','henry'],  
        ['age',25],  
        ['sex','男'],  
        [obj1,'map键可以是对象'],  
        [obj2,'因此不会覆盖上一个数据'],  
        [[1,2],'map键还可以是数组'],  
    ]);   
//set设置、get获取  
    map.set("friends",['eric','alice']).set(['foods'],'chocolete');  
    console.log(map);  
    console.log(map.get('name'));  
    console.log(map.get(obj1));   

运行:
这里写图片描述
delete、has、clear、keys(()、values()、entries()

        //delete  
        map.<span style="background-color:rgb(255,204,204);">delete(obj1)</span>;  
        console.log(map);  

这里写图片描述

        //has  
        console.log(map.has(obj2)); 

运行:
true

    //keys()、values()、entries()  
    console.log(map.keys());  
    console.log(map.values());  
    console.log(map.entries());  

这里写图片描述
这里写图片描述
这里写图片描述

        //clear  
        map.clear();  
        console.log(map);  

这里写图片描述
⑤遍历:

//遍历  
map.forEach(function(value,index){  
    console.log(index + ':' +value);  
})  

运行:
这里写图片描述
⑥注意事项

//注意事项  
map.set({},'我和你地址不一样');  
map.set({},'我和你地址也不一样,所以我也能被添加进集合里');  
console.log(map);  

这里写图片描述

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值