Map、Set、WeakMap、WeakSet,Symbol

99 阅读3分钟

map、set、promise、proxy 不能通过babel降级。

一、set:

image.png

1-1、Set构造函数创建一个set对象,

参数:可选,不传就创建一个空对象,参数必须是可迭代的对象否则就报TypeError,可迭代对像,就是对象或者原型链上实现了Symbol.iterator方法:如下

var set=new Set('acx');
console.log(set);//{a,b,c}
var set2=new Set([1,2,4])
console.log(set2);//{1,2,4}
var set3=new Set(1);//TypeError

1-2、set对象可以存储任何类型的唯一值,在ECMAScript规范的早期版本中,这不是基于和===操作符中使用的算法相同的算法:如下

console.log(NaN===NaN);//false
console.log(null===null);//true
console.log(undefined===undefined)//true;
console.log(null===undefined);//true
// {1, null, undefined, NaN,object, 0}
var set2=new Set([1,null,undefined,NaN,NaN,{a:1}])

1-3、实例方法:

var set = new Set('acx');
console.log(set.size) //3
console.log(set.add('1'))
console.log(set.size) //4
console.log(set.delete('a')) //true
console.log(set.size) //3
console.log(set.delete('a')) //false
console.log(set.has('c')) //true
console.log(set.clear()) //undefined
console.log(set.size) //0

1-4:遍历方法:

var set = new Set('acx'),
keys = set.keys();//
console.log(keys); //键名迭代器对象
console.log(keys.next()); //{value: "a", done: false}
console.log(keys); //键名迭代器对象
console.log(set.values()); //键值迭代器对象
console.log(set.entries()); //键值对迭代器对象

for(let item of keys){
	console.log(item);
}
			
for (let item of set) {
	console.log(item);
}
			
set.forEach((item,key,arr)=>{
	console.log(item);
})

案例:数组去重,或者字符串去重

var str='abcdabcde'
arr=[1,0,2,undefined,3,4,2,4,undefined];
console.log(Array.from(new Set(str)).join('') );
console.log([... new Set(arr)]);

二、Map

image.png 对象保存键值对,键为唯一的,并且能够记住键的原始插入顺序。任何值(对象或者[原始值] 都可以作为一个键或一个值。键的比较是基于====

1、Map构造函数创建一个map对象

参数:是一个数组或者实现了iterator方法的对象

var arr = [
	['name', 'zhangsan'3],
	['age', 'z8'],
	['hobby']
]
let myMap = new Map(arr);
console.log(myMap);//{"name" => "zhangsan", "age" => "z8", "hobby" => undefined}

大概实现:

let myMap2 = new Map();
//形参解构赋值
arr.forEach(function([key,value]){
        if(!myMap2.has(key)){
            myMap2.set(key,value)
        }
	
})
console.log(myMap2);
// arr.forEach(function(item){
// 	let [key,value]=item
// 	myMap2.set(key,value)
// })
// console.log(myMap2);
console.log(myMap.get('name'));//zhangsan

数组元素中多余的参数忽略,参数不够据就默认undefined

三、WeakMap、WeakSet:

WeakMap的键不须时引用类型,WeakSet的元素必须是引用类型,而他们都不可遍历。由于他们存储的都是对象的弱引用,如果这些对象没有被其他成员引用,则他们的引用计数永远都是0,导致垃圾回收机制随时都可以把他们内存释放了,所以他们是不安全的

四、Symbol

每个从Symbol() 返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符;这是该数据类型仅有的目的

image.png

const symbol1 = Symbol(),
	symbol2 = Symbol(42),
	symbol3 = Symbol('foo'),
	symbol4 = Symbol('foo'),
	symbol6 = Symbol.for('foo'),
	symbol7 = Symbol.for('foo');
console.log(typeof symbol1); //symbol
console.log(symbol2 === 42); //false
console.log(symbol3.toString()); //Symbol(foo)
console.log(symbol3 === symbol4); //false
console.log(symbol3 === symbol4); //false
console.log(symbol6===symbol7);//true
console.log(Symbol.keyFor(symbol6));//foo
console.log(Symbol.keyFor(symbol4));//undefined

案例1:在Object对象的原型上定义一个命名唯一的方法:

Object.defineProperty(Symbol,'typeOf',{
	value:Symbol('typeOf')
})
Object.prototype[Symbol.typeOf]=function(){
	var value=Object.prototype.toString.call(this);
	return value.match(/\[object (.*?)\]/)[1].toLowerCase()
}
console.log((1)[Symbol.typeOf]());//number
console.log([][Symbol.typeOf]());//array
console.log('123'[Symbol.typeOf]());//string

案例2:map、set转数组:

var arr = [
	['name', 'zhangsan',2],
	['age', 'z8'],
	['hobby']
],
 mymap=new Map(arr),
 mySet=new Set(arr[0]);
function toArray(arg){
	console.log([...arg]);
	console.log(Array.from(arg));
	console.log(Array.prototype.slice.call(arg));//这个方法不行
}
			
toArray(mymap)
toArray(mySet)

案例3:map转对象、对象转map

function toObj(map) {
	let obj = {}
	for (let [key, value] of map) {
		obj[key] = value
	}
	return obj
}
console.log(toObj(mymap));

function ObjToMap(obj) {
	let map =new Map(arr)
	for (let key in obj) {
		map.ser(key,obj[key])
	}
	return 
}