javaScript的Map数据类型

一、Map数据类型产生的背景

1. JavaScript 天生就有缺陷
   • 34岁的系统程序员Brendan Eich只用10天时间就把Javascript设计出来了。（多肽语言）
   • 所以javaScript自然是有缺陷的，所以就有了javaScript的更新版本
2. ES6更新版本
   • ES6版本 是一个非常重要的JavaScript版本
   • 在 ES6版本时,对JavaScript的语法缺陷做了补充和修改
   • 提出很多重要的语法结构：Class类、箭头函数、 Map、SET数据类型、方法函数等
   • 让 JavaScript从 弱类型的计算机语言 进化为 半强类型的计算机语言

二、Map类型简介

1. Map是一个类似于对象的数据类型
2. 与常规对象和Array不同的是，它是“键控集合“
3. 它的行为有稍许不同，并且在特定的上下文中使用，它可以提供相当大的性能优势

• 对象：
  • 存储数据都是 键值对的形式
  • 键名 : 数值 <-----> key : value

1.Map的工作形式

Map更像是以空间为代价，换取速度上的提升。那么对于空间和速度的衡量，必然存在一个阈值。在数据量比较少时，相比与速度的提升，其牺牲的空间代价更大，此时显然是不适合使用Map；当数据量足够大时，此时空间的代价影响更小。所以，看开发者如何衡量两者之间的关系，选择最优解。

2.Map的叫法

• 可以是MAP、Map或者map，一般大家都能理解
• 不过希望写成Map
• 而map是数组的常用方法（就跟 forEach 便历数组这样的方法）

3.Map基本语法：new Map()

三、Map的使用

1.定义Map数据类型

（1）语法形式1：构造函数形式 — 在声明时,同时赋值

• 参数必须是：

  1. 二维数组的形式

  2. 二维数组的键名是 Map单元数据的键名

  3. 二维数组的数值是 Map单元数据的数值

     const m = new Map([ [键名1,数据1] , [键名2,数据2] ]);   //语法格式
     const m = new Map([ ['name','张三'] , ['age',18] ]);   //案例展示
     

（2）语法形式2: 构造函数声明之后再赋值

• 书写方式：Map对象.set(键名 , 数值)

  	const m = new Map();   //声明构造函数
  	m.set(name , '张三');  //赋值
  

2.获取Map数据类型中的数据

语法形式：Map数据类型.get(‘键名’) ------> m.get(‘name’)

        const m = new Map([ ['name','张三'] , ['age',18] ]); //Map数据类型
        console.log(m.get('name'));  //获取Map数据类型并在控制台打印
        m.get["测试"]  //也可以这样写：

结果展示：

3.删除Map数据类型中,指定的键名

语法形式：Map数据类型.delete(‘键名’) ------> m.delete(‘name’);

        const m = new Map([ ['name','张三'] , ['age',18] ]); //Map数据类型
        m.delete('name');
        console.log(m)  //打印出来m，展示结果

结果展示：

4. 清除Map数据类型中,所有的键名和数据

语法形式：Map数据类型.clear()

        const m = new Map([ ['name','张三'] , ['age',18] ]); //Map数据类型
        m.clear();
        console.log(m)  //打印出来m，展示结果

结果展示：

5. 判断是否是Map的成员

语法形式：Map数据类型.has(‘键名’)

        const m = new Map([ ['name','张三'] , ['age',18] ]); //Map数据类型
        console.log(m.has('a'));
        console.log(m.has('name'));

结果展示：

6. 循环遍历

使用forEach() 语法,循环遍历 Map 数据类型

        const m = new Map([ ['name','张三'] , ['age',18] ]); //Map数据类型
        m.forEach(function(item,key){
            console.log(item,key)
        })

结果展示：