当前位置:网站首页>ES6:Map
ES6:Map
2022-06-26 12:36:00 【HaanLen】
Map对象
1、Map 对象
Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
2、Maps 和 Objects 的区别
- 一个 Object 的键只能是字符串或者 Symbols,但一个 Map 的键可以是任意值。
- Map 中的键值是有序的(FIFO 原则),而添加到对象中的键则不是。
- Map 的键值对个数可以从 size 属性获取,而 Object 的键值对个数只能手动计算。
- Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。
3、Map 中的 key
(1)key 是字符串
var myMap=new Map();
var kk='a string';
myMap.set(kk,"for a thing");
console.log(myMap.get(kk))//for a thing
console.log(myMap.get("a string"))//for a thing
(2)key 是对象
var myMap=new Map();
var keyObj = {
}
myMap.set(keyObj,"for a thing");
console.log(myMap.get(keyObj))//for a thing
console.log(myMap.get({
}))//undefined
(3)key 是函数
var myMap=new Map();
var keyFunc=function () {
}
myMap.set(keyFunc,"for a thing");
console.log(myMap.get(keyFunc))//for a thing
console.log(myMap.get(function(){
}))//undefined
(4)key 是 NaN
var myMap=new Map();
myMap.set(NaN,"for a thing");
console.log(myMap.get(NaN))//for a thing
var otherNaN=Number("you")
console.log(myMap.get(otherNaN))//for a thing
var myMap=new Map();
myMap.set(NaN,"for a thing");
console.log(myMap.get(NaN))//for a thing
var otherNaN=Number(2,4)
console.log(myMap.get(otherNaN))//undefined
4、Map 的迭代
var myMap=new Map();
myMap.set(0,"def")
myMap.set(1,"rfg")myMap.set(3,"ppp")
for(var [index,value] of myMap){
console.log(index+"="+value)
}
var myMap=new Map();
myMap.set(0,"def")
myMap.set(1,"rfg")myMap.set(3,"ppp")
for(var [index,value] of myMap.entries()){
console.log(index+"="+value)
}
这个 entries 方法返回一个新的 Iterator 对象,它按插入顺序包含了 Map 对象中每个元素的 [index, value] 数组。
var myMap=new Map();
myMap.set(0,"def")
myMap.set(1,"rfg")
myMap.set(3,"ppp")
for (var key of myMap.keys()) {
console.log(key);
}
这个 keys 方法返回一个新的 Iterator 对象, 它按插入顺序包含了 Map 对象中每个元素的键。
var myMap=new Map();
myMap.set(0,"def")
myMap.set(1,"rfg")
myMap.set(3,"ppp")
for (var value of myMap.values()) {
console.log(value);
}
这个 values 方法返回一个新的 Iterator 对象,它按插入顺序包含了 Map 对象中每个元素的值。
var myMap=new Map();
myMap.set(0,"def")
myMap.set(1,"rfg")
myMap.set(3,"ppp")
myMap.forEach(function(value,key){
console.log(key+"="+value);
},myMap);

5、Map 对象的操作
(1)Map 与 Array的转换
var k=[["one","thr"],["two","yht"]]
var myMap=new Map(k);
var arr=Array.from(myMap)
console.log(arr)
Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组
(2)Map 的克隆
var myMap1 = new Map([["key1", "value1"], ["key2", "value2"]]);
var myMap2 = new Map(myMap1);
console.log(myMap2===myMap1)//false
//Map 对象构造函数生成实例,迭代出新的对象。
console.log(myMap2)

(3)Map 的合并
var first = new Map([[1, 'one'], [2, 'two'], [3, 'three'],]);
var second = new Map([[1, 'uno'], [2, 'dos']]);
// 合并两个 Map 对象时,如果有重复的键值,则后面的会覆盖前面的,对应值即 uno,dos, three
var merged = new Map([...first, ...second]);
边栏推荐
- Installing MySQL under Linux (RPM package installation)
- [redis series] redis learning 16. Redis Dictionary (map) and its core coding structure
- PHP laravel+gatewayworker completes im instant messaging and file transfer (Chapter 1: basic configuration)
- Realize microservice load balancing (ribbon)
- 软件测试 - 概念篇
- 2022 edition of China's cotton chemical fiber printing and dyeing Market Status Investigation and Prospect Forecast Analysis Report
- Assembly language (7) operation instruction
- PHP unit conversion
- Demand scale forecast and investment competitiveness analysis report of China's new material market 2022-2028
- PHP laravel+gatewayworker completes im instant messaging and file transfer functions (Chapter 2: explanation of business logic)
猜你喜欢

Tiger Dao VC products are officially launched, a powerful supplement to seektiger ecology

Microservice governance (nocas)

Websocket and socket IO case practice

机组实践实验8——使用CMStudio设计基于基本模型机微程序指令(1)

EasyGBS如何解决对讲功能使用异常?

Several rare but useful JS techniques
![[solved] laravel completes the scheduled job task (delayed distribution task) [execute a user-defined task at a specified time]](/img/13/c2c63333a9e5ac08b339449ea17654.jpg)
[solved] laravel completes the scheduled job task (delayed distribution task) [execute a user-defined task at a specified time]

Vscode solves the problem of Chinese garbled code
![[极客大挑战 2019]RCE ME 1](/img/66/e135f7e5a7cbdeb5b697f3939a3402.png)
[极客大挑战 2019]RCE ME 1

Fengshentai old shooting range Kali series
随机推荐
几行代码就能实现复杂的 Excel 导入导出,这个工具类真心强大!
"Pinduoduo and short video speed version", how can I roast!
NFS shared storage service installation
Investment forecast and development strategy analysis report of China's rural sewage treatment industry in 2022
PHP laravel+gatewayworker completes im instant messaging and file transfer (Chapter 1: basic configuration)
[solved] data duplication or data loss after laravel paginate() paging
[极客大挑战 2019]RCE ME 1
Websocket and socket IO case practice
Xiaobai lazy special-win10-win11 one click installation version
Encapsulate request request of uni app
How long ago did PHP get
2022 edition of Beijing 5g industry investment planning and development prospect forecast analysis report
TP5 thinkphp5 report serialization of'closure'is not allowed
无人机遥感在森林监测的部分应用研究案例总结
软件测试 - 基础篇
Ubuntu安装配置PostgreSQL(18.04)
nvm安装教程
7-2 摘花生
Spark-day02-core programming-rdd
7-2 大盗阿福