ES6的Map和Set的了解和练习

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>canvas测试</title>
</head>
<body>
  <canvas width="400" height="600" id="canvas-test">
  </canvas>
  <script>
      // ES6的Map和Set
      // javaScript的默认对象表示方式{},就是键必须是字符串。但实际上Number或者其他数据类型作为键也是非常合理的。
      // 一 Map
      // 1 判断浏览器是否支持Map和Set!
      'use strict';
      var m = new Map();
      var s = new Set();
      console.log('你的浏览器支持Map和Set!');
      // 2 Map是一组键值对的结构,具有极快的查找速度。
      // 给定一个名字,要查找对应的成绩。用Map实现,只需要一个“名字”-“成绩”的对照表,直接根据名字查找成绩,无论这个表有多大,查找速度都不会变慢。
      var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);
      m.get('Michael'); // 95
      // 3 Map的初始化和 获取,增加,删除的特性
      // 初始化Map需要一个二维数组,或者直接初始化一个空Map
      var map=new Map([['Bob',85]]);// 空的Map
      map.set('limy',88);// 添加新的 key-value
      map.has('Bob');// 是否存在Bob:true
      map.set('Michael',89);
      map.delete('Michael');// 删除 key,'Michael'
      map.get('Michael');
      //由于一个key只能对应一个value,所以,多次对一个key放入value,后面的值会把前面的值冲掉

      // 二 Set
      // Set和Map类似,也是一组key的集合,但不存储value。由于key不能重复,所以,在Set中,没有重复的key。
      var s1=new Set();
      var s2=new Set([1,2,3])

      // 重复元素在 Set 中自动被过滤

      var s=new Set([1,2,3,3,'3']);
      // add(key) 可以添加元素到Set中,可以重复添加相同的key,但是不会有效果
      s.add(4);
      s.add(4);
      // delete(key) 方法可以删除元素
      s.delete(2);
  </script>
</body>
</html>
posted @ 2019-12-26 15:15  叶韵  Views(170)  Comments(0Edit  收藏  举报