Set
Set是ES6给开发者带来的一种新的数据结构,类似数组,最重要的不同点是:它的值不会有重复项。Set本身是一个构造函数,你可以理解为一个类,使用的时候需要用new来创建一个实例。
var s = new Set(['a','b','c']);
console.log(s);
// Set(3)?{'a', 'b', 'c'}
四个常用方法:添加、删除、是否含有、清空
一个常用属性: size
var s = new Set(['a','b','c']);
console.log(s);
s.add(1) // 添加值
console.log(s);
console.log(s.size); // size 属性类似于数组的长度
console.log(s.delete('a')) // 删除a返回一个布尔值
console.log(s);
console.log(s.has('b')); // 是否含有b ,返回一个布尔类型
s.clear() // 清空
console.log(s.size)
// 打印结果如下
Set(3)?{'a', 'b', 'c'}
Set(4)?{'a', 'b', 'c', 1}
4
Set(3)?{'b', 'c', 1}
true
0
set最常用的就是利用不会重复的特性做数组去重:
let arr=[1,1,1,2,2,3,4,5,3]
let newArr = Array.from(new Set(arr))
console.log(newArr);
// [1, 2, 3, 4, 5]
Map
这个map类似于对象,存的是键值对:key=>value;但是它的key键名的类型不再局限于字符串类型了,它可以是各种类型的值;初始化也是需要new。并且也不会重复;先介绍一下他的基础语法
let m = new Map([
["name","zs"],
["age",18]
]);
console.log(m);
// Map(2)?{'name' => 'zs', 'age' => 18}
上面提到他的key可以是任意类型
let m = new Map()
//数组类型的键名
m.set([1],2);
//对象类型的键名
m.set({"name":"Zhangsan"},2);
//布尔类型的键名
m.set(true,2);
//Symbol类型的键名
m.set(Symbol('name'),2);
//null为键名
m.set(null,2);
//undefined为键名
m.set(undefined,2);
console.log(m);
// 如下
Map(6) {Array(1) => 2, {…} => 2, true => 2, null => 2, …}
[[Entries]]
0: {Array(1) => 2}
1: {Object => 2}
2: {true => 2}
3: 2
4: {null => 2}
5: {undefined => 2}
size: 6
[[Prototype]]: Map
四个常用方法:设置键值对、获取键值、删除、是否含有、清空
一个常用属性: size
let m = new Map([
["age",18]
]);
console.log(m.size); // 获取map的长度
m.set('name','zs') // 设置key:name value:zs
m.set('age',20) // 设置键值对,age已经存在更新值
console.log(m);
console.log(m.get('age')); // 通过key获取value
console.log(m.delete('name')) // 删除key为 1 的 返回一个布尔值
console.log(m.has('name')); // map是否含有key为 1 的键值对
m.clear() // 清空
// 结果
1
Map(2)?{'age' => 20, 'name' => 'zs'}
20
true
false
entries(条目)
set和map都有这个方法 entries() ,供我们来进行遍历写法如下
// m为map
let m = new Map([
["age",18],
['name','zs']
]);
// 或者set
let m = new Set(['a','b','c']);
for(let item of m.entries()){
console.log(item);
}
// 解构赋值
for(let [key,value] of m.entries()){
console.log(key,value);
}
// map:
['age', 18]
['name', 'zs']
// 解构map
age 18
name zs
// set:
['a', 'a']
['b', 'b']
['c', 'c']
// 解构set
a a
b b
c c
可以看到map是键值对格式,但是set的key,value是同一个值。其实对于遍历,它还给我们提供了另外两个函数,可以理解是entries的删减版
// 只遍历key
for(let key of m.keys()){
console.log(key);
}
// 只遍历value
for(let value of m.values()){
console.log(value);
}
set和map,好用就好用在,他们可以自动去重,并且提供了一些方法,让我们能更好的管理和使用他们,一般项目来说,使用他们处理大量数据,可以减轻后端压力,增删改查在前端,再来一个保存接口就可以搞定,n多个接口再能完成的事情
|