set map

Set数据结构

类似于数组,但又跟数组不一样,数组里面可以有重复的值,Set里面不能有重复值

let arr = ['a','b','c','a'];
console.log(arr);  // ["a", "b", "c", "a"]

let set = new Set(['a','b','c','a']);
console.log(set);   // Set(3) {"a", "b", "c"}

创建数组的两种方式,一字面量,二构造函数

创建Set的方式,使用构造函数

new Set(['a','b'])

接受一个数组参数

let set = new Set(['a','b','c']);
console.log(set);   // Set(3) {"a", "b", "c"}

// 例一
const set = new Set([1, 2, 3, 4, 4]);
[...set]
// [1, 2, 3, 4]

// 例二
const items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);
items.size // 5

Set 数据的方法
1. 添加内容 add()

往set里面添加内容

let set = new Set();
set.add('a');
set.add('b');
console.log(set);   // Set(2) {"a", "b"}
2. 删除内容 delete()
console.log(set);   // Set(2) {"a", "b"}
set.delete('a');
console.log(set);   // Set(1) {"b"}
3. 判断set有没有一个值 has()
set.has('a');     // false
set.has('b');     // true
4. 获取set数据的个数,长度,size

和length很像就是一个属性,不是方法

set.size;     // 1
5. 清空set数据的所有内容 clear()
let set = new Set(['a','b','c']);
console.log(set);  // Set(3) {"a", "b", "c"}
set.clear();
console.log(set)   // Set(0) {}
set 循环

原型里有 Symbol(Symbol.iterator) 方法就可以迭代,可以使用for of

let set = new Set(['a','b','c']);
for(var item of set){  // 默认就是values
    console.log(item);
}
//  a
//  b
//  c

我们都知道数组是有下标的,但是set好像也有,set的下标获取的好像就是值

遍历key

let set = new Set(['a','b','c']);
for(var item of set.keys()){
    console.log(item);
}
//  a
//  b
//  c

遍历值

let set = new Set(['a','b','c']);
for(var item of set.values()){
    console.log(item);
}
//  a
//  b
//  c

遍历每一项

let set = new Set(['a','b','c']);
for(var item of set.entries()){
    console.log(item);
}
//  ["a", "a"]
//  ["b", "b"]
//  ["c", "c"]

// 也可以直接解构
for(var [key,value] of set.entries()){
    console.log(key,value);
}

如果是我,我还是喜欢forEach遍历

let set = new Set(['a','b','c']);
set.forEach((value,index) => {
    console.log(value,index);
})
//  a a
//  b b
//  c c

set 的add方法的链式操作

因为add返回自己

let set = new Set();
set.add('a').add('b').add('c');

set转为数组

因为只有转为数组后,才能使用数组身上set不具有的一些方法,比如map

let arr = [...new Set()];

数组去重

set 的用处

let arr = [1,3,5,1,2,6,3,1,5,2];

let newArr = [...new Set(arr)];
console.log(newArr);   // [1, 3, 5, 2, 6]

还可以字符串去重

let str = 'wuwei';
let newStr = [...new Set(str)].join('')

  1. 向 Set 加入值的时候,不会发生类型转换,所以5"5"是两个不同的值。
  2. Set 内部判断两个值是否不同,使用的算法叫做“Same-value equality”,它类似于精确相等运算符(===),主要的区别是NaN等于自身,而精确相等运算符认为NaN不等于自身。
  3. 注意:两个对象总是不相等的。
Array.from()可以将 Set 结构转为数组。
const items = new Set([1, 2, 3, 4, 5]);
const array = Array.from(items);

set数据使用数组map和filter方法

比如我想让set中的1,2,3,变为2,4,6

使用set自己的for…of…循环

let set = new Set([1,2,3]);
let newSet = new Set();
for(let item of set){
    newSet.add(item*2);
}
console.log(newSet);    // {2, 4, 6}

使用map方法

let set = new Set([1, 2, 3])

let newSet = [...set].map(
    (item, index, set) => item * 2
)
console.log(new Set(newSet))

使用filter过滤

let set = new Set([1,2,3,4,5,6,7,8]);

set = new Set([...set].filter(val=>val%2==0))
console.log(set);   //Set(4) {2, 4, 6, 8}

我们都知道数组里面可以放对象,其实set也可以

let set = new Set();

let json = {
    a: 1,
    b: 2
}
set.add(json);
console.log(set); // Set(1) {{…}}

Map

类似于json,但是json的键key只能是字符串

map的key可以是任意类型

map的使用

为了解决这个问题,ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。

1. 设置map set()
let map = new Map();

map.set(key,value);   // 设置键值

map.set('a','wuwei');   // Map(1) {"a" => "wuwei"}

用json作为key

let map = new Map();

let json = {
    a:1,
    b:2
}
// json作为key值
map.set(json,'wuwei');  // Map(1) {{…} => "wuwei"}

// json作为value值
map.set('a',json);  // Map(1) {"a" => {…}}

2. 获取map get()
let map = new Map();

let json = {
    a:1,
    b:2
}
// json作为key值
map.set(json,'wuwei'); 

// 获取map
map.get(json);   // "wuwei"

3. 删除一项 delete()

map.delete();

删除成功返回true,删除失败返回false

map.delete(json);  // 删除一项

4. 判断有没有 has()

返回布尔值,有则为true,没有则为false

map.has(json);

5. 清空 clear()
map.clear();

6. 循环

循环和set一样

for(let [key,value] of map.entries()){
    console.log(key,value)
}

for(let key of map.keys()){}
for(let value of map.values()){}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值