介绍
ES6引入了新的数据结构Map，用于存储一组键值对。与对象不同，Map允许键的任何类型（包括对象、NaN等），并且不会自动将键转为字符串。同时Map还有更多的API，比如size属性、clear()方法等。ES8更是 added新的API，如：forEach、reduce等。
在前端开发中，Map对象可以应用于多个场景，比如存储数据、缓存数据、实现单向映射或者双向映射等等。接下来我们就来深入探讨一下Map对象的详细使用。
创建Map对象
- 使用构造函数创建
Map对象可以通过构造函数创建，构造函数可以有一个可迭代的entries参数，它可以是能够返回key-value对的任何对象。
----- --- - --- ----- -------- ---------- -------- --------- ---
- 使用set()方法向Map对象添加键值对
----- --- - --- ------ --------------- ---------- --------------- ----------
Map对象的常用API
- Map.prototype.size
size属性返回Map对象元素个数。
----- --- - --- ----- -------- ---------- -------- --------- --- ---------------------- -- -
- Map.prototype.set()
set()方法用于向Map对象添加键值对，如果该键已经存在，则它的值将被更新为新的值。
----- --- - --- ------ --------------- ---------- --------------- ----------
- Map.prototype.get()
get()方法用于获取Map对象的某个键值对的值，如果该键不存在，则返回undefined。
----- --- - --- ----- -------- ---------- -------- --------- --- ----------------------------- -- ------ ----------------------------- -- ---------
- Map.prototype.delete()
delete()方法用于删除Map对象中的某个键值对，操作成功返回true，否则返回false。
----- --- - --- ----- -------- ---------- -------- --------- --- -------------------------------- -- ---- ---------------------- -- -
- Map.prototype.clear()
clear()方法用于清除Map对象中所有的键值对。
----- --- - --- ----- -------- ---------- -------- --------- --- ------------ ---------------------- -- -
- Map.prototype.has()
has()方法用于检测某个键是否存在于Map对象中，存在则返回true，否则返回false。
----- --- - --- ----- -------- ---------- -------- --------- --- ----------------------------- -- ---- ----------------------------- -- -----
示例代码
实现单向映射
----- --- - --- ------ -------------- -------- ---------------- -------- --------------- -------- ---------------------------- -- ----
实现双向映射
----- ---- - --- ----- ------- -------- --------- -------- -------- ------- --- ----- ---- - --- ------ --- ---- --- -- -- --------------- - ----------- --- - ------------------------------ -- ---
结论
Map对象是JavaScript中一个非常实用的数据类型，可以进行单向映射、双向映射等操作，同时它也具有一系列的API，方便使用。在开发中，我们可以根据具体的需求来选择使用Map对象。同时，ES8还增加了很多新的API，可以扩展Map对象的功能，提供更好的使用体验。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/670b3571d91dce0dc888666a