当前位置: 首页 > Web前端 > HTML5

ES6(7)——Set&Map

时间:2023-04-05 14:38:27 HTML5

DirectorySet数据结构声明SetSet方法StoreDataDeleteDataEmptyDataFindDataSizeLengthReadDataGetAPI&keysAPI&valuesAPI&entriesAPIforEachAPIfor-ofAPIModifyDataArray去重ES6可以使用Set来处理Map数据结构(字典类型)。前面对象的键都是字符串。会不会有错误?映射的键可以是任何类型。如果实例化一个map对象,Map方法添加/编辑数据,删除数据,清除数据,查找数据,Size长度,读取数据,获取API&keysAPI&valuesAPI&entriesAPIforEachAPIfor-ofAPIMap的区别和ObjectWeakSet一起学习layoutSet数据结构和WeakMapES6-ES10除了使用Object来存储数据,ES6还可以使用Set来存储数据。Set中存储的成员是唯一的,不会重复。如果有重复,会自动过滤掉(针对数组去重,下面有说明)可以链式调用add,forEach,delete,clear,has,size,for-of来declareSet//declareaSetlets=newSet()//声明和初始化数据,传入的参数是可遍历的对象,而不仅仅是数组lets=newSet([1,2,3,4])set方法存储数据addAPIlets=newSet()s.add('hello')s.add('goodbye')console.log(s)//Set(2){"hello","goodbye"}//可以使用简写形式,因为它返回当前对象s.add('hello').add('goodbye')console.log(s)//Set(2){"hello","goodbye"}//遇到重复数据会过滤s.add('hello').add('goodbye').add('hello')console.log(s)//Set(2){"hello","goodbye"}删除数据deleteAPIlets=newSet()s.add('你好').add('再见')console.log(s)//Set(2){"hello","goodbye"}s.delete('goodbye')//如果删除成功,返回trueconsole.log(s)//Set(1){"hello"}cleardataclearAPIlets=newSet()s.add('hello').add('goodbye')console.log(s)//Set(2){"hello","goodbye"}s.clear()console.log(s)//Set(0){}查找数据有APIlets=newSet()s.add('hello').add('goodbye')console.log(s.has('hello'))//truesizelengthsizePropertylets=newSet()s.add('hello').add('goodbye')console.log(s.size)//2读取数据keysAPI&valuesAPI&entriesAPIlets=newSet()s.add('hello').add('goodbye')//返回keyset,SetIterator为遍历器console.log(s.keys())//SetIterator{"hello","goodbye"}//返回值集合console.log(s.values())//SetIterator{"hello","goodbye"}//返回键值对集合console.log(s.entries())//SetIterator{"hello"=>"hello","goodbye"=>"goodbye"}//Set本质上还是一个Object,还是以key的形式存在-值对forEachAPIlets=newSet()s.add('hello').add('goodbye')s.forEach(item=>{console.log(item)})for-ofAPIlets=newSet()s.add('hello').add('goodbye')for(letitemifs){console.log(item)}目前没有提供修改数据的修改接口。修改需要删除再添加数组去重ES6。使用Setconstresult=Array.from(newSet(arr)]//[1,2,3,4]//或constresult=[处理constarr=[1,2,1,3,4,1]...newSet(arr)]//[1,2,3,4]Map数据结构(字典类型)对象的key之前是字符串,会不会报错ES6之前的对象的key是一个字符串,下面会遇到到这个问题。key直接toString,所以我们可以访问valueconstobj={}obj[true]='value'obj[123]='value'obj[{a:1,b:2}]='haha'console.log(Reflect.ownKeys(obj))//['123','true','[objectObject]']console.log(obj[{}])//haha??console.log(obj['[objectObject]'])//haha??map的key可以是任意类型。下面的键是一个对象constm=newMap()consttom={name:'xm'}m.set(tom,90)console.log(m)//Map{{name:'xm'}=>90}console.log(m.get(tom))//90下面的键是一个数字,或者一个函数letmap=newMap()map.set(1,'value-2')leto=function(){console.log('o')}map.set(o,4)console.log(map)//Map(2){1=>"value-2",?=>4}?表示一个函数functionconsole.log(map.get(o))//4如果实例化了一个map对象//声明一个Mapletmap=newMap()//声明并初始化数据,传入的参数是可遍历对象//但是遍历元素有条件,必须使用keyletmap=newMap([1,2,3])//ErrorIteratorvalue1isnotanentryobjectisnotintheformofadictionary//正确的写法//为外层数据满足可遍历对象,内层数组为外层对象的一个??元素,第一个1为key,第二个2为value,同前面的3为key,下面4是valueletmap=newMap([[1,2]],[3,4])console.log(map)//Map(2){1=>2,3=>4}//区别:map中的key可以是任意值,set中的元素可以是任意值Map方法map方法包括set,delete,has,clear,size,forEach,for-of添加/编辑数据集API——(添加可修改)letmap=newMap()map.set(1,2)map.set(3,4)console.log(map)//Map(2){1=>2,3=>4}map.set(1,2).set(3,4)console.log(map)//地图(2){1=>2,3=>4}map.set(1,3)console.log(map)//Map(2){1=>3,3=>4}删除数据deleteAPI——(删除索引值)letmap=newMap()map.set(1,2).set(3,4)//Map(2){1=>2,3=>4}map.delete(1)console.log(map)//Map(1){3=>4}清除数据clearAPIletmap=newMap()map.set(1,2).set(3,4)//Map(2){1=>2,3=>4}map.clear()console.log(map)//地图(0){}FinddatahasAPI-(findindexvalue)letmap=newMap()map.set(1,2).set(3,4)console.log(map.has(1))//trueSizelengthsizePropertyletmap=newMap()map.set(1,2).set(3,4)console.log(map.size)//2读取数据data的顺序和初始化get的顺序一致API&keysAPI&valuesAPI&entriesAPIletmap=newMap()map.set(1,2).set(3,4)console.log(map.get(1))//2console.log(映射.keys())//MapIterator{1,3}console.log(map.values())//MapIterator{2,4}console.log(map.entries())//MapIterator{1=>2,3=>4}forEachAPIletmap=newMap()map.set(1,'value-2').set(3,'value-4')map.forEach((value,key)=>{console.log(value,key)})//value-21//value-43for-ofAPIletmap=newMap()map.set(1,'value-2').set(3,'value-4')//map是一个可遍历的对象,[key,value]与前面定义的数据结构一致for(let[key,value]ofmap){console.log(key,value)}//1"value-2"//3"value-4"Map和Object的区别除了以上区别:Map和Object的区别MapObjectkey的类型Map的key可以是任意值,包括函数、对象、基本类型目的。它是字符串和符号键的顺序。Map中的键是有序的,对象的键是无序的。
-如果Object是整型或者整型字符串,会按升序排列,其余数据结构依次排列按照输入的顺序
-如果Object中有整数等数据类型,则整数放在最前面。对于键值对的统计,可以直接通过size属性获取一个Map的键值对,CountingObjects只能手动计算键值对的遍历。Map可以直接迭代,而Object的迭代需要获取它的key数组。Object的遍历方式不如Map通用。Map在频繁增删键值对的场景下会有表现。优点-WeakSet和WeakMap不常用,API相同。WeakSet与Set的区别:存储的数据只能是对象。WeakMap与Map的区别:只能接受对象类型的key。