ES6-Map
<html>
<head>
<title>ES6 Map</title>
</head>
<body>
<script>
/*
*Map 对象 :Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
*map中的key
*key是字符串
*/
{
var myMap = new Map();
var key = "这是key";
myMap.set(key, "这是key得value")
console.log(myMap.get(key));//输出 这是key得value 把一个已经赋值的变量传过去 所有还是==myMap.get("这是key")
console.log(myMap.get("这是key"));
}
console.log("----------------------map中的key(是对象):分割线-------------------------------");
//key是对象
{
var myMap = new Map();
var keyObj = {};
myMap.set(keyObj, "和键keyObj关联的值");
console.log(myMap.get(keyObj));//输出 这是key得value 把一个已经赋值的变量传过去 所有还是==myMap.get("这是key")
console.log(myMap.get({}));// undefined, 因为 keyObj !== {}
}
console.log("----------------------map中的key(是函数):分割线-------------------------------");
//key是函数
{
var myMap = new Map();
var keyObj = function () { };
myMap.set(keyObj, "和键keyObj关联的值");
console.log(myMap.get(keyObj));//输出 这是key得value 把一个已经赋值的变量传过去 所有还是==myMap.get("这是key")
console.log(myMap.get(function () { }));// undefined, 因为 keyFunc !== function () {}
}
console.log("----------------------map中的key(NaN):分割线-------------------------------");
//key 是 NaN
{
var myMap = new Map();
myMap.set(NaN, "Not A Number");
console.log(myMap.get(NaN));//输出Not A Number
var otherNum = Number("foo");
console.log(myMap.get(otherNum));
}
/*
*Map迭代
*/
//Map迭代:对key value 的遍历 for...of方式
console.log("----------------------Map迭代(for...of方式):分割线-------------------------------");
{
var myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");
//遍历key value
for (var [key, value] of myMap) {
console.log(key + "=" + value); //顺序输出key-value
}
console.log("----------------------Map迭代(循环输出):分割线-------------------------------");
//遍历key value
for (var [key, value] of myMap.entries()) {
console.log(key + "=" + value); //顺序输出key-value
}
console.log("----------------------Map迭代(循环输出):分割线-------------------------------");
//遍历key
for (var key of myMap.keys()) {
console.log(key);//输出key
}
console.log("----------------------Map迭代(循环输出):分割线-------------------------------");
//遍历value
for (var value of myMap.values()) {
console.log(value);//输出value
}
}
//Map迭代:对key value 的遍历 forEach()方式
console.log("----------------------Map迭代(forEach()方式):分割线-------------------------------");
{
var myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");
myMap.forEach(function (value, key) {
console.log(key + "=" + value); //顺序输出key-value
}, myMap)
}
/*
*Map对象的操作
*/
console.log("----------------------Map对象的操作(Map 与 Array的转换):分割线-------------------------------");
//Map 与 Array的转换
{
var kvArray = [["key1", "value1"], ["key2", "value2"]];
// Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象
var myMap = new Map(kvArray);
for (var [key, value] of myMap) {
console.log("key=" + key + "value=" + value);//遍历后按顺序输出
}
// 使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组
var arr=Array.from(myMap);
console.log(arr);//输出为一个二维键值对数组
}
console.log("----------------------Map对象的操作(Map的克隆):分割线-------------------------------");
//Map的克隆
{
var kvArray = [["key1", "value1"], ["key2", "value2"]];
// Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象
var myMap = new Map(kvArray);
var cloneMap=new Map(myMap);
for (var [key, value] of cloneMap) {
console.log("key=" + key + "value=" + value);//遍历后按顺序输出
}
console.log(myMap==cloneMap);//false Map 对象构造函数生成实例,迭代出新的对象。
}
console.log("----------------------Map对象的操作(Map的合并):分割线-------------------------------");
//Map的合并
{
var first = new Map([[1, 'one'], [2, 'two'], [3, 'three'],]);
var second = new Map([[1, 'uno'], [2, 'dos']]);
var mergin=new Map([...first,...second]);//有重复的键会被覆盖掉,后面覆盖前面
for (var [key, value] of mergin) {
console.log("key=" + key + "value=" + value);//遍历后按顺序输出uno,dos,three 这里one two 就被覆盖掉了
}
}
</script>
</body>
</html>
教程来源于:https://www.runoob.com/w3cnote/es6-tutorial.html

浙公网安备 33010602011771号