06 ES6中的Map类型

ES6 中的 Map 是一种集合数据结构,与 Set 类似,但它是用来存储键值对的。Map 提供了更灵活的迭代和更广泛的键类型支持,与普通的对象相比,Map 的键可以是任何值,包括对象和函数。

以下是 Map 类型的一些关键特性和常用方法:

特性

  1. 键的多样性Map 的键可以是任何类型,不仅限于字符串或数字。
  2. 顺序性Map 保留了键值对的插入顺序。
  3. 唯一性 :每个键在 Map 中都是唯一的。

创建 Map

  • 使用 new Map() 构造函数创建一个空的 Map
  • 可以在创建时传入一个可迭代对象(其结构通常为 [键, 值] 的数组),来初始化 Map
javascript 复制代码
let myMap = new Map();
let myMapFromIterable = new Map([['key1', 'value1'], ['key2', 'value2']]);

常用方法

  1. set(key, value) :将一个键值对添加到 Map 对象中。

    javascript 复制代码
    myMap.set('key', 'value');
  2. get(key):返回与给定键关联的值。

    javascript 复制代码
    let value = myMap.get('key');
  3. has(key) :检查 Map 对象是否包含特定的键。

    javascript 复制代码
    let hasKey = myMap.has('key');
  4. delete(key) :从 Map 对象中移除指定的键值对。

    javascript 复制代码
    myMap.delete('key');
  5. clear() :移除 Map 对象中的所有键值对。

    javascript 复制代码
    myMap.clear();
  6. size :返回 Map 对象中键值对的数量。

    javascript 复制代码
    let size = myMap.size;
  7. keys() :返回一个新的迭代器对象,该迭代器包含 Map 对象中的键。

  8. values() :返回一个新的迭代器对象,该迭代器包含 Map 对象中的值。

  9. entries() :返回一个新的迭代器对象,该迭代器包含 Map 对象中的键值对数组。

  10. forEach(callbackFn, thisArg) :对 Map 对象中的每个键值对执行给定函数。

javascript 复制代码
myMap.forEach((value, key) => {
  console.log(`${key}: ${value}`);
});

转换为数组

  • 可以使用 Array.from() 方法将 Map 的键、值或键值对数组转换为数组。
javascript 复制代码
let keysArray = Array.from(myMap.keys());
let valuesArray = Array.from(myMap.values());
let entriesArray = Array.from(myMap.entries());

示例

javascript 复制代码
// 创建一个 Map 实例
let myMap = new Map();

// 添加键值对
myMap.set('key1', 'value1');
myMap.set('key2', 'value2');

// 获取与键关联的值
console.log(myMap.get('key1')); // 输出: value1

// 检查键是否存在
console.log(myMap.has('key1')); // 输出: true

// 删除键值对
myMap.delete('key1');

// 获取 Map 的大小
console.log(myMap.size); // 输出: 1

// 清空 Map
myMap.clear();

// 遍历 Map
myMap.set('key3', 'value3');
myMap.forEach((value, key) => {
  console.log(`${key}: ${value}`); // 输出: key3: value3
});

// 转换为数组
let keys = Array.from(myMap.keys());
let values = Array.from(myMap.values());
let entries = Array.from(myMap.entries());

Map 是一种非常有用的数据结构,特别适合于需要快速查找、添加和删除键值对的场景。它提供了一种更灵活的方式来存储和管理键值对集合。

相关推荐
小阮的学习笔记3 分钟前
Vue3中使用LogicFlow实现简单流程图
javascript·vue.js·流程图
YBN娜3 分钟前
Vue实现登录功能
前端·javascript·vue.js
阳光开朗大男孩 = ̄ω ̄=4 分钟前
CSS——选择器、PxCook软件、盒子模型
前端·javascript·css
minDuck8 分钟前
ruoyi-vue集成tianai-captcha验证码
java·前端·vue.js
小政爱学习!29 分钟前
封装axios、环境变量、api解耦、解决跨域、全局组件注入
开发语言·前端·javascript
魏大帅。34 分钟前
Axios 的 responseType 属性详解及 Blob 与 ArrayBuffer 解析
前端·javascript·ajax
花花鱼40 分钟前
vue3 基于element-plus进行的一个可拖动改变导航与内容区域大小的简单方法
前端·javascript·elementui
k093344 分钟前
sourceTree回滚版本到某次提交
开发语言·前端·javascript
EricWang13581 小时前
[OS] 项目三-2-proc.c: exit(int status)
服务器·c语言·前端
September_ning1 小时前
React.lazy() 懒加载
前端·react.js·前端框架