前言
JavaScript 的核心数据结构之一是对象(Object)。对象是一种以键值对的方式存储数据的结构。ES6 中加入了 Map 和 Set 数据结构,其中 Map 可以看做是一个更完善的对象,拥有更多的操作方法。在 ES7 中,Map 数据结构也得到了进一步增强,本篇文章将详细介绍 ES7 中的 Map 数据结构。
Map 数据结构概述
Map 数据结构是以键值对的形式存储数据的数据结构,不同于对象的是,在 Map 中键和值可以是任何类型的数据,且键名不重复。Map 也提供了许多更加方便实用的方法,这使得它更加适用于实际的开发需求。
Map 数据结构的使用方法
创建 Map 实例
我们可以通过 new Map() 创建一个 Map 实例。
let myMap = new Map();
设置键值对
我们可以使用 set() 方法设置键值对,在 set() 方法中,第一个参数为键名,第二个参数为键值。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); console.log(myMap); // Map { 'name' => 'Tom', 'age' => 18 }
获取键值对
我们可以使用 get() 方法获取指定键名的键值。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); console.log(myMap.get('name')); // Tom console.log(myMap.get('age')); // 18
判断 Map 中是否存在某个键名
我们可以使用 has() 方法来判断 Map 中是否存在某个键名。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); console.log(myMap.has('name')); // true console.log(myMap.has('sex')); // false
获取 Map 中所有的键名
我们可以使用 keys() 方法获取 Map 中所有的键名。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); console.log(myMap.keys()); // MapIterator { 'name', 'age' }
获取 Map 中所有的键值
我们可以使用 values() 方法获取 Map 中所有的键值。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); console.log(myMap.values()); // MapIterator { 'Tom', 18 }
获取 Map 中所有的键值对
我们可以使用 entries() 方法获取 Map 中所有的键值对。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); console.log(myMap.entries()); // MapIterator { [ 'name', 'Tom' ], [ 'age', 18 ] }
获取 Map 中键值对数量
我们可以使用 size 属性获取 Map 中键值对的数量。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); console.log(myMap.size); // 2
删除指定键名的键值对
我们可以使用 delete() 方法删除指定键名的键值对。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); myMap.delete('name'); console.log(myMap); // Map { 'age' => 18 }
清空 Map
我们可以使用 clear() 方法清空 Map 中的所有键值对。
let myMap = new Map(); myMap.set('name', 'Tom'); myMap.set('age', 18); myMap.clear(); console.log(myMap); // Map {}
总结
Map 数据结构是 JavaScript 原生提供的更加实用的数据结构之一,通过本文的学习,我们了解了 Map 的基本用法,可以更加灵活地运用 Map 数据结构完成我们实际工作中的需求。
示例代码
-- -------------------- ---- ------- --- ----- - --- ------ ----------------- ------- ---------------- ---- ------------------------------- -- --- ------------------------------ -- -- ------------------------------- -- ---- ------------------------------ -- ----- -------------------------- -- ----------- - ------- ----- - ---------------------------- -- ----------- - ------ -- - ----------------------------- -- ----------- - - ------- ----- -- - ------ -- - - ------------------------ -- - --------------------- ------------------- -- --- - ----- -- -- - -------------- ------------------- -- --- --
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64d21adab5eee0b52597b00a