map和key

最新推荐文章于 2025-12-15 15:15:21 发布

原创最新推荐文章于 2025-12-15 15:15:21 发布 · 55 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #vue.js

本文介绍了JavaScript中的Map对象，与普通对象在键值对存储、创建方式、顺序、调用和设置属性等方面的区别，以及Map的特性和常用方法。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
	<script type="text/javascript">
		// let arrs = [["age",18],["sex","男"]]
		// let mapObj = new Map(arrs);
		// let sum = "aa";
		// mapObj.set("name","张三");
		// mapObj.set(sum,99);
		// console.log(mapObj.get("name"));
		// console.log(mapObj.get("aa"));
		// console.log(mapObj.get(sum));
		// mapObj.set("{}","111");
		// mapObj.set({},"222");
		// mapObj.set([1,2,3],"222");
		// mapObj.set(function(){},"333");
		// mapObj.set(NaN,"333");
		// mapObj.set(null,"333");
		// mapObj.set(undefined,"333");
		// console.log(mapObj);
		// console.log(mapObj.entries());
		// for(let [a,b] of mapObj.entries()){
		// 	console.log(a);
		// 	console.log(b);
		// }
		// console.log(mapObj.keys());
		// for(let a of mapObj.keys()){
		// 	console.log(a);
		// }
		// console.log(mapObj.values());
		// for(let a of mapObj.values()){
		// 	console.log(a);
		// }
		// for(let [a,b] of mapObj){
		// 	console.log(a);
		// 	console.log(b);
		// }
		// let arr = [[11,22],[33,44]]
		// for(let [a,b] of arr){
		// 	console.log(a);
		// 	console.log(b);
		// }
		// mapObj.forEach(function(item,index){
		// 	console.log(item);
		// 	console.log(index);
		// })
		var kvArray = [["key1", "value1"], ["key2", "value2"]];
		var kvArray1 = [["key1", "value3"], ["key4", "value4"]];
		var myMap = new Map(kvArray);
		var myMap1 = new Map(kvArray1);
		console.log(...myMap);
		let myMap2 = new Map([...myMap,...myMap1])
		console.log(myMap);
		console.log(myMap1);
		console.log(myMap2);
		// Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象
		// var myMap = new Map(kvArray);
		// var myMap1 = new Map(myMap);
		// console.log(myMap);
		// console.log(myMap1);
		// console.log(myMap==myMap1);
		// 使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组
		// var outArray = Array.from(myMap);
		// console.log(outArray);
		
		// Map的特性
		// Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
		// Map 对象记得键的原始插入顺序。
		// Map 对象具有表示映射大小的属性。
		
		// Map 对象的几个常用方法和属性
		// new Map() 创建新的 Map 对象。
		// set() 为 Map 对象中的键设置值。
		// get() 获取 Map 对象中键的值。
		// entries() 返回 Map 对象中键/值对的数组。
		// keys() 返回 Map 对象中键的数组。
		// values() 返回 Map 对象中值的数组。
		
		// 共同点
		// 二者都是以key-value的形式对数据进行存储;
		
		// 不同点
		// key的数据类型范围不同
		// obj可以作为key的仅有number、string、symbol。
		// map均可以。
		
		// key的顺序不同。
		// obj通过obj.keys（）打印出来的属性顺序是 number–字符串
		// map的key顺序是声明顺序。
		
		// 创建方式不同。
		// obj有三种创建方式 字面量{}、new Object（） 、构造函数。
		// map仅支持new Map（）
		
		// key的调用不同。
		// map只能用原生的get方法调用。
		
		// 设置属性的方式不同
		// map只能使用set（key，val）方法设置属性。
		
		// Size属性
		// map有size属性，对象没有。Map.size 返回 Map 中元素的数量，而 Object 的键值对个数只能手动计算
	</script>
</html>