Map对象基础篇
  26sCdHIjX99x 2023年11月02日 59 0

引言

Map 对象是一种键值对存储的数据结构,它可以用于存储任意类型的值,并提供了快速的查找和迭代功能。Map 中的键可以是任意类型的值,包括字符串、数字、符号、对象等,而值也可以是任意类型的值,包括数字、字符串、布尔值、对象等。

Map 对象提供了快速查找和迭代的功能,它的出现极大地提高了前端处理数据的效率,今天我们来总结一下 Map 的一些基本方法。

下面是一些常用的 Map 方法:

get(key)

获取指定键对应的值,如果键不存在则返回 undefined。

let map = new Map();
map.set('a', 1);
console.log(map.get('a')); // 1
console.log(map.get('b')); // undefined

set(key, value)

设置指定 key 对应的值,如果 key 已存在则会覆盖原有的值。

let map = new Map();
map.set('a', 1);
const obj1 = {
    name: "obj"
};
const obj2 = {
    age: 99
};
map.set(obj1, obj2);
console.log(map.get('a')); // 1
console.log(map.get(obj1)); // {age: 99}
map.set('a', 2);
console.log(map.get('a')); // 2

delete(key)

删除指定键值对,删除成功则返回 true,如果键不存在则返回 false。

let map = new Map();
map.set('a', 1);
console.log(map.delete('a')); // true
console.log(map.get('a')); // undefined
map.delete('a'); // false

has(key)

判断指定 key 是否存在于 Map 中,如果存在则返回 true,否则返回 false。

let map = new Map();
map.set('a', 1);
console.log(map.has('a')); // true
console.log(map.has('b')); // false

clear()

清空 Map 中所有的键值对。

let map = new Map();
map.set('a', 1);
map.set('b', 2);
map.clear();
console.log(map.size); // 0

entries()

Map.entries() 返回 Map 中所有键值对的迭代器,其中包含了 Map 中所有的键值对。

可以使用 for...of 循环或者 reduce() 方法遍历 Map.entries() 返回的迭代器。

let map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);

const entries = map.entries();
console.log(entries); // MapIterator {'a' => 1, 'b' => 2, 'c' => 3}

for (const entry of entries) {
  console.log(entry[0] + ': ' + entry[1]);
}

// 输出:
// a: 1
// b: 2
// c: 3

keys()

Map.keys() 返回 Map 中所有键的迭代器。

let map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);

const keys = map.keys();
console.log(keys); // MapIterator {'a', 'b', 'c'}

for (const key of keys) {
  console.log(key);
}

// 输出:
// a
// b
// c

values()

Map.values() 返回 Map 中所有值的迭代器。

let map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);

const values = map.values();
console.log(values); // MapIterator {1, 2, 3}

for (const value of values) {
  console.log(value);
}

// 输出:
// 1
// 2
// 3

forEach(callbackFn, thisArg)

对 Map 中的键值对执行回调函数,并对每个键值对执行一次。

回调函数可以接受三个参数:

  • 当前键值对的值
  • 当前键值对的键
  • Map 本身
let map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);

map.forEach((value, key) => {
  console.log(key + ': ' + value);
});

// 输出:
// a: 1
// b: 2
// c: 3

size

获取 Map 中键值对的数量。

let map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);
console.log(map.size); // 3

Map 对象的遍历方法

Map 的遍历除了上面介绍的 forEach 方法,还有 for...of 方法。

let map = new Map();
map.set('a', 1);
map.set('b', 2);
map.set('c', 3);

for (const [key,value] of map) {
    console.log(`${key}: ${value}`);
}

// 输出:
// a: 1
// b: 2
// c: 3

结束语

关于 Map 对象的一些基础知识就总结这么多,希望能够对大家有所帮助。

~

~ 全文完,感谢阅读!

~

【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年11月08日 0

暂无评论

推荐阅读
  f18CFixvrKz8   2024年05月20日   90   0   0 JavaScript
  fxrR9b8fJ5Wh   2024年05月17日   52   0   0 JavaScript
  2xk0JyO908yA   2024年04月28日   40   0   0 JavaScript
26sCdHIjX99x
作者其他文章 更多