es6----set map应用场景
Posted sexintercourse
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了es6----set map应用场景相关的知识,希望对你有一定的参考价值。
1.数组去重
2.字符串去重
属性:
Set.prototype.size
:返回Set
实例的成员总数。
Set 实例的方法分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员)。下面先介绍四个操作方法。
add(value)
:添加某个值,返回 Set 结构本身。delete(value)
:删除某个值,返回一个布尔值,表示删除是否成功。has(value)
:返回一个布尔值,表示该值是否为Set
的成员。clear()
:清除所有成员,没有返回值。
遍历操作
Set 结构的实例有四个遍历方法,可以用于遍历成员。
keys()
:返回键名的遍历器values()
:返回键值的遍历器entries()
:返回键值对的遍历器forEach()
:使用回调函数遍历每个成员
需要特别指出的是,Set
的遍历顺序就是插入顺序。这个特性有时非常有用,比如使用 Set 保存一个回调函数列表,调用时就能保证按照添加顺序调用。
(1)keys()
,values()
,entries()
keys
方法、values
方法、entries
方法返回的都是遍历器对象
(2)forEach()
Map 对象
Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
Map方法
var myMap = new Map(); myMap.set("bar", "baz"); myMap.set(1, "foo"); myMap.size; // 2 myMap.has("bar"); // true myMap.clear(); myMap.size; // 0 myMap.has("bar") // false
使用for..of方法遍历
var myMap = new Map(); myMap.set(0, "zero"); myMap.set(1, "one"); for (var [key, value] of myMap) { console.log(key + " = " + value); } // 将会显示两个log。一个是"0 = zero"另一个是"1 = one" for (var key of myMap.keys()) { console.log(key); } // 将会显示两个log。 一个是 "0" 另一个是 "1" for (var value of myMap.values()) { console.log(value); } // 将会显示两个log。 一个是 "zero" 另一个是 "one" for (var [key, value] of myMap.entries()) { console.log(key + " = " + value); } // 将会显示两个log。 一个是 "0 = zero" 另一个是 "1 = one"
使用forEach()方法迭代映射
myMap.forEach(function(value, key) { console.log(key + " = " + value); }, myMap) // 将会显示两个logs。 一个是 "0 = zero" 另一个是 "1 = one" Set 对象
Set 对象允许你存储任何类型的唯一值,无论是原始值或者是对象引用。
Set 对象方法
var mySet = new Set(); mySet.add(1); mySet.add("foo"); mySet.size; // 2 mySet.has("foo"); // true mySet.clear(); mySet.size; // 0 mySet.has("bar") // false
迭代Set对象
// 迭代整个set // 按顺序输出:1, "some text" for (let item of mySet) console.log(item); // 按顺序输出:1, "some text" for (let item of mySet.keys()) console.log(item); // 按顺序输出:1, "some text" for (let item of mySet.values()) console.log(item); // 按顺序输出:1, "some text" //(键与值相等) for (let [key, value] of mySet.entries()) console.log(key); // 转换Set为Array (with Array comprehensions) var myArr = [v for (v of mySet)]; // [1, "some text"] // 替代方案(with Array.from) var myArr = Array.from(mySet); // [1, "some text"] // 如果在html文档中工作,也可以: mySet.add(document.body); mySet.has(document.querySelector("body")); // true // Set和Array互换 mySet2 = new Set([1,2,3,4]); mySet2.size; // 4 [...mySet2]; // [1,2,3,4] // 用forEach迭代 mySet.forEach(function(value) { console.log(value); });
Set 与 Array 的联系
var myArray = ["value1", "value2", "value3"]; // 用Set构造器将Array转换为Set var mySet = new Set(myArray); mySet.has("value1"); // returns true // 用...(展开操作符)操作符将Set转换为Array console.log([...mySet]); // 与myArray完全一致
...扩展语句
扩展语法允许一个表达式在期望多个参数(用于函数调用)或多个元素(用于数组字面量)或多个变量(用于解构赋值)的位置扩展。 let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; arr1 = [...arr2, ...arr1]; console.log(arr1) // [3, 4, 5, 0, 1, 2]
应用一:Set对象数组去重
var arr=[3, 62, 3, 38, 20, 42, 14, 5, 38, 29, 42]; console.log(new Set(arr)) 可以封装一个函数 function uniqueArray(arr){ return Array.from(new Set(arr)); } 用这个函数可以数组去重。 或者如下写也可以,比较简单的数组去重 [...new Set([1,3,4,5,1,2,3,3,4,8,90,3,0,5,4,0])]
以上是关于es6----set map应用场景的主要内容,如果未能解决你的问题,请参考以下文章