Set是什么?
ES6新增了一种数据结构叫做Set。它类似于数组,但是它本身没有重复值。
new Set() 的参数可以是什么?
1.数组
2.类似于数组的对象
比如DOM操作返回的NodeList集合,以及函数内部的arguments对象。
// NodeList对象 document.querySelectorAll('p'); // arguments对象 function args() { return arguments; }
需要注意的地方
1.在Set数据结构里,有一个size属性,可以把他看做是数组中的length。
2.Set数据结构没有键名,也就是说,你不能像数组一样使用索引来得到它的某个值。
将Set结构转换成数组
虽然Set和数组类似,但是数组中的很多方法不能用在Set上面。所以有些时候需要将它转换成数组。
使用Array.from方法
此方法用于将两类对象转为真正的数组:
· 类似数组的对象(array-like object)
· 可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)
Set实例的方法
对实例中数据进行增/删/查的方法:
· add(value):添加某个值,返回Set结构本身。
· delete(value):删除某个值,返回一个布尔值,表示删除是否成功。
· has(value):返回一个布尔值,表示该值是否为Set的成员。
· clear():清除所有成员,没有返回值。
var color = new Set(["red", "yellow", "blue"]); color.add("green"); // {"red", "yellow", "blue", "green"} color.delete("yellow"); // true color // {"red", "blue", "green"} color.has("blue"); // true color.has("yellow"); // false color.clear(); color // {}
用于遍历实例中数据的方法:
· keys():返回键名的遍历器
· values():返回键值的遍历器
· entries():返回键值对的遍历器
· forEach():使用回调函数遍历每个成员
keys()、values()、entries()方法返回的都是遍历器对象。
由于Set结构没有键名,只有键值(或者说键名和键值是同一个值),所以keys()和values()的结果相同。
var color = new Set(["red", "yellow", "blue"]); for(let item of color.keys()) { console.log(item); } // red // yellow // blue for(let item of color.values()) { console.log(item); } // red // yellow // blue for(let item of color.entries()) { console.log(item); } // ["red", "red"] // ["yellow", "yellow"] // ["blue", "blue"]
而forEach()方法则可以像对数组一样使用,只不过和数组不一样的是,回调函数中第二个参数并不是索引,它依旧还是键值。
/* Set使用forEach方法 */ var color = new Set(["red", "yellow", "blue"]); color.forEach((value, key) => { console.log(`[${key}] ${value}`) }) // [red] red // [yellow] yellow // [blue] blue
/* 数组使用forEach方法 */ var userName = ["Barben", "Lonely", "Zero-B"]; userName.forEach((item, index) => { console.log(`[${index}] ${item}`); }) // [0] Barben // [1] Lonely // [2] Zero-B