ES6之Map和WeakMap

最新推荐文章于 2025-09-16 23:55:45 发布

原创最新推荐文章于 2025-09-16 23:55:45 发布 · 558 阅读

0 ·

CC 4.0 BY-SA版权

ES6 专栏收录该内容

18 篇文章

订阅专栏

本文详细介绍了JavaScript中的Map对象，包括其创建、使用方法如添加、获取、删除元素等操作，同时对比了Map与对象的区别，并提供了代码示例。

map类似对象，但是对象的键（key）只能是字符串或者数字等原始值

map的key可以是任何类型

定义一个map结构

new Map()

map(key, value);

向map中添加数据

获取某一个值：

map.get(key)

删除一个值：

map.delete(key)

判断是否有对应的值

map.has(key)

清空map列表：

map.clear()

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title></title>
  <link rel="stylesheet" href="">
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
</body>
<script>
  let map = new Map();
  map.set('name', 'ReSword');
  console.log(map)
  let obj = {
    a: 1,
    b: 2
  }
  map.set(obj, 'Object');
  console.log(map);
  console.log(map.get(obj));
  console.log(map.has(obj));
  map.delete(obj);
  console.log(map);
  console.log(map.has(obj));
  map.clear();
  console.log(map);
</script>
</html>

map循环

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title></title>
  <link rel="stylesheet" href="">
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
</body>
<script>
  let map = new Map();
  map.set('name', 'ReSword');
  console.log(map)
  let obj = {
    a: 1,
    b: 2
  }
  map.set(obj, 'Object');
  console.log(map);
  for (let [key, value] of map) {
    console.log(key, value);
  }
</script>
</html>

对于map来说，也有map.keys(),map.values(),map.entries()

map的forEach

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title></title>
  <link rel="stylesheet" href="">
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
</body>
<script>
  let map = new Map();
  map.set('name', 'ReSword');
  console.log(map)
  let obj = {
    a: 1,
    b: 2
  }
  map.set(obj, 'Object');
  console.log(map);
  map.forEach((value, key) => {
    console.log(value, key);
  })
</script>
</html>