1.map数据结构出现的原因?

JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。为了能实现将对象作为键值对的key,ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。

(1)map结构: key=>value

Json和map格式的对比

map的效率和灵活性更好

例如常见的json对象格式:

let json = {
sex:男'',
age:18
}
console.log(json.sex);//男

但是这种反应的速度要低于数组和map结构。

let json = {
sex:'男',
age:18
}
console.log(json.sex);//男
var map=new Map();
map.set(json,'student');
console.log(map);

结果为:

2.map的增删查

(1)使用set增加值

let json = {
sex:'男',
age:18
} var map=new Map();
map.set('person',json);
console.log(map);

结果为:

 (2)使用get取值

现在取person对应的值。

let json = {
sex:'男',
age:18
}
var map=new Map();
map.set('person',json);
console.log(map.get("person"));

结果为:

(3)删除delete

使用delete删除指定key对应的值。

let json = {
sex:'男',
age:18
}
var map=new Map();
map.set('person',json);
map.delete("person")
console.log(map)

结果为:

(4)查找是否存在has

通过key查找是否存在,返回true或者false。

let json = {
sex:'男',
age:18
}
var map=new Map();
map.set('person',json);
console.log(map.has('person'))//true
console.log(map.has('test'))//false

(5)size属性

size属性可以获得map中键值对的个数。

let json = {
sex:'男',
age:18
}
var map=new Map();
map.set('person',json);
console.log(map.size)//

(6)使用clear方法清除map中所有元素

let json = {
sex:'男',
age:18
}
var map=new Map();
map.set('person',json);
map.clear()
console.log(map)//{}

结果为:{}

ES6系列_12之map数据结构的更多相关文章

  1. es6的Set和Map数据结构

    Set 和 Map 数据结构 Set WeakSet Map WeakMap Set § ⇧ 基本用法 ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set ...

  2. ES6笔记03-Set和Map数据结构

    ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值.Set本身是一个构造函数,用来生成Set数据结构. var s = new Set(); [2, 3, 5, 4, ...

  3. ES6 学习 -- Set和Map数据结构

    一.Set对象数据结构 1.Set数据结构类似数组,但是其每个成员都是唯一值,没有重复,且Set本身是一个构造函数,用来生成Set数据结构,用法如下: const setData = new Set( ...

  4. 前端笔记之React(六)ES6的Set和Map&immutable和Ramda和lodash&redux-thunk

    一.ES6的Set.Map数据结构 Map.Set都是ES6新的数据结构,都是新的内置构造函数,也就是说typeof的结果,多了两个: Set 是不能重复的数组 Map 是可以任何东西当做键的对象 E ...

  5. ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环

    ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. va ...

  6. ES6中的Set、Map数据结构

    Map.Set都是ES6新的数据结构,他们都是新的内置构造函数.也就是说typeof的结果,多了两个. 他们是什么:  Set是不能重复的数组.    Map是可以任何东西当做键的对象: ES6 提供 ...

  7. es6学习笔记-set和map数据结构

    ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. const s = new Set(); [2, 3 ...

  8. JavaScript(ES6)学习笔记-Set和Map数据结构(一)

    一.Set 1.ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. , , , , ']); s; // ...

  9. es6笔记(5)Map数据结构

    概要 字典是用来存储不重复key的Hash结构.不同于集合(Set)的一点,字典使用的是[key,value]的形式来存储数据. JavaScript的对象(Object:{})只能用字符串当做key ...

随机推荐

  1. php--------网页开发实现微信JS的(定位,地图显示,照片选择功能)

    今天说说微信网页开发中一下JS的功能,分享一下,希望对各位有所帮助. 前提:要有公众号,和通过微信认证,绑定域名,得到相应信息,appid,appsecret等. 微信开发文档:https://mp. ...

  2. 使用AspNetPager进行分页,查询条件丢失问题

    在Asp.Net中使用AspNetPager进行分页时,发现一个问题: 当通过查询条件进行查询后,对查询结果进行翻页操作时,查询条件会丢失. 当修改UrlPaging属性后(设置UrlPaging=“ ...

  3. voj 1406 floyd

    传说,上古时期的某个七月七日,王母娘娘为了阻止牛郎织女的爱情,划一道玉钗拆散鸳鸯,使两人“星桥鹊驾,经年才见,想离情.别恨难穷.”于是,“执子之手,与子偕老”成了天下有情人共同的希翼. 在气宇轩昂.玉 ...

  4. 基于Oracle的SQL优化(崔华著)-学习笔记

    201704171025 01. 列rows记录的就是执行计划中每一个执行步骤所对应的Cardinality的值 列Cost(%CPU)记录的就是执行计划中的每一个执行步骤对应的成本 02. Comp ...

  5. 在am中定义消息集束,并在CO中验证之后抛出异常。

    需求:在页面上点某个按钮的时候,需要收集所有异常并抛出. -------------------------------------------方式1:参考 EBS OAF开发中的错误/异常处理(Er ...

  6. Oracle Sourcing Implementation and Administration Guide(转)

    原文地址 Oracle Sourcing Implementation and Administration Guide

  7. springboot模糊查询

    在学习MyBatis过程中想实现模糊查询,可惜失败了.后来上百度上查了一下,算是解决了.记录一下MyBatis实现模糊查询的几种方式. 数据库表名为test_student,初始化了几条记录,如图: ...

  8. 008——php字符串中的处理函数(七)

    <?php /** *字符串处理函数(六)get_magic_quotes_runtime set_magic_quotes_runtime strip_tags *get_magic_quot ...

  9. 007——php字符串中的处理函数(六)

    <?php /** * 一.addslashes() 在预定义字符串前添加反斜杠 * * stripslashes() 把转义字符串前的反斜杠删除 * get_magic_quotes_gpc ...

  10. 征信接口调用,解析(xml)

    数据传输格式报文格式:xml public CisReportRoot queryCisReport(PyQueryBean pyQueryBean) throws Exception { CisRe ...