<!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>

ES6的Map和Set的了解和练习的更多相关文章

  1. [ES6] 18. Map

    ES6 provides Map, it is a set of k-v pair. Key can be number, string, object, function and even unde ...

  2. ES6 Set & Map

    ES6 Set & Map OK ES6 Map https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Globa ...

  3. ES6中map和set用法

    ES6中map和set用法 --转载自廖雪峰的官方网站 一.map Map是一组键值对的结构,具有极快的查找速度. 举个例子,假设要根据同学的名字查找对应的成绩,如果用Array实现,需要两个Arra ...

  4. es6的map()方法解释

    es6的map()方法解释   map方法的作用不难理解,即“映射”,也就是原数组被“映射”成对应新数组.下面这个例子是数值项求平方: var data = [1, 2, 3, 4]; var arr ...

  5. es6 关于map和for of的区别有哪些？

    1.es6  关于map和for of的区别有哪些? ——主要想了解一下性能方面的

  6. es6的Map结构

    es6的Map结构主要解决Object的键名只能是单一属性的问题.它可以是字符串,对象,数组,等等 其中有个问题要注意一下,就是 var map = new Map(); map.set(['a'], ...

  7. ES6中Map数据结构学习笔记

    很多东西就是要细细的品读然后做点读书笔记,心理才会踏实- Javascript对象本质上就是键值对的集合(Hash结构),但是键只能是字符串,这有一定的限制. 1234 var d = {}var e ...

  8. ES6新增Map、Set和iterable

    Map需要一个二维数组 var test_map = new Map(["mians",99],["regink",88]) test_map.get(&quo ...

  9. ES6中Map与其他数据结构的互相转换

    最近在学习ES6的基础知识,整理了一下Map与其他数据结构相互转换的写法. Map转为数组的方法 let myMap = new Map([[true, 7], [{foo: 3}, ['abc']] ...

  10. ES6中map数据结构学习

    在项目中遇到一个很恶心的需求,然后发现ES6中的map可以解决,所以简单学习了一下map. Javascript的Object本身就是键值对的数据结构,但实际上属性和值构成的是“字符串-值”对,属性只 ...

随机推荐

  1. 推荐2个可用于毕设的微信小程序

    智能垃圾回收小程序 下载: http://market.zhenzikj.com/detail/103.html 2. 通用答题小程序 下载http://market.zhenzikj.com/det ...

  2. 前台主页功能-前台轮播图功能完成-git介绍和安装-git使用流程-git常用命令-git忽略文件

    目录 前台主页功能-前台轮播图功能完成-git介绍和安装-git使用流程-git常用命令-git忽略文件 昨日内容回顾 今日内容概要 今日内容详细 0 导出项目依赖 0 学长问题解析 1 前台主页功能 ...

  3. plsql美化文件配置

    --generalFUNCTION MGRNAME(P_EMPNO IN EMP.EMPNO%TYPE) RETURN EMP.ENAME%TYPE IS RESULT EMP.ENAME%TYPE; ...

  4. css3中-webkit是什么意思

    在CSS样式中很多样式名前缀都带有'-webkit-',但在CSS提供的API中查询不到这些样式名. 原因:CSS3中新增了一些属性,针对不同的浏览器,规定其内核名称让它们可以对这些新增属性进行解析. ...

  5. git 提交本地仓库到远程

    提交本地仓库到远程指定仓库 假如已经在远程github创建了项目 在本地创建了和github同样工程并添加了代码,如eclipse创建出工程并写了代码.要把这些代码提交到github git bash ...

  6. yaml文件读取转化为类

    首先你要有一个文件读取的方法,写一个根据传入路径 + 类来自动返回对应类的方法. /** * 根据传入的path,加载配置文件内容到对应class中 */ public static <T> ...

  7. Flutter 中的普通路由、普通路由传值、 命名路由、命名路由传值

    一.Flutter 中的路由 Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航.并提供了管理堆栈的方法.如:Navigator.push ...

  8. docker实战(8)使用docker-compose快速搭建zookeeper集群

    镜像下载 docker pull zookeeper 复制 zookeeper 集群的搭建 创建名为docker-compose.yml的文件 输入以下内容 version: '2' services ...

  9. mysql 创建表 datetime NOT NULL DEFAULT '0000-00-00 00:00:00' 默认值失败

    set global sql_mode='ONLY_FULL_GROUP_BY,STRICT_TRANS_TABLES,ERROR_FOR_DIVISION_BY_ZERO,NO_AUTO_CREAT ...

  10. .NET Core 3.0 WebApi 使用Swagger

    1.安装指定版本: Swashbuckle.AspNetCore 5.0.0-rc4(目前稳定版本4.0.1在AspNetCore3.0中会报错误) 2.后台C#代码要严格格式必须加[HttpPost ...