ES6基础语法之Map和Set对象

一、Map对象

Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。

Map中的键值是有序的。

let myMap = new Map();
myMap.set("23","乔丹");
myMap.set("33","皮蓬");
let name = myMap.get("33");
console.log(name);  //皮蓬
let has = myMap.has("24"); //查找是否含有此键
console.log(has); //false

Map的迭代：

let myMap = new Map();
myMap.set("23","乔丹");
myMap.set("33","皮蓬");
myMap.set("99","罗德曼");
//循环键
for (let key of myMap.keys()) {
  console.log(key);
}
//循环值
for (let value of myMap.values()) {
  console.log(value);
}
//循环键和值
for (let [key, value] of myMap) {
  console.log(key + " = " + value);
}
//或
for (let [key, value] of myMap.entries()) {
  console.log(key + " = " + value);
}

//使用forEach循环
myMap.forEach(function(value,key){
	console.log(key + "=" + value);
},myMap);

Map 与 Array的转换：

//二维数组转换成map对象
let arr = [[23,"乔丹"],[33,"皮蓬"],[99,"罗德曼"]];
let myMap = new Map(arr);
for (let [key, value] of myMap) {
  console.log(key + " = " + value);
}
//map对象转换成二维数组
let outArr = Array.from(myMap);
console.log(outArr);

Map的克隆：

let myMap1 = new Map([[23,"乔丹"],[33,"皮蓬"],[99,"罗德曼"]]);
let myMap2 = new Map(myMap1);
for (let [key, value] of myMap2) {
   console.log(key + " = " + value);
}

Map的合并(合并两个 Map 对象时，如果有重复的键值，则后面的会覆盖前面的)

let myMap1 = new Map([[23,"乔丹"],[33,"皮蓬"],[99,"罗德曼"]]);
let myMap2 = new Map([[23,"詹姆斯"],[24,"科比"],[11,"姚明"]]);
let myMap = new Map([...myMap1,...myMap2]); //合并之后詹姆斯会替换乔丹
for (let [key, value] of myMap) {
	console.log(key + " = " + value);
}

二、Set对象

Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。

Set 对象存储的值总是唯一的，所以需要判断两个值是否恒等。有几个特殊值需要特殊对待：

（1） +0 与 -0 在存储判断唯一性的时候是恒等的，所以不重复；

（2） undefined 与 undefined 是恒等的，所以不重复；

（3） NaN 与 NaN 是不恒等的，但是在 Set 中只能存一个，不重复。

let mySet = new Set();
mySet.add(1);
mySet.add("hello");  //这里体现了类型的多样性
mySet.add(2);
mySet.add(1); //这里添加不了,这里体现了值的唯一性
console.log(mySet); //{1,"hello",2}
console.log(mySet.has(3)); //false, 是否含有3

以下代码体现了对象之间引用不同不恒等，即使值相同，Set 也能存储

let mySet = new Set();
let o = {a: 1, b: 2};
mySet.add(o);
mySet.add({a: 1, b: 2});
console.log(mySet);

Set类型转换：

//Array 转 Set
let arr = ["乔丹","皮蓬","罗德曼"];
let mySet = new Set(arr);
console.log(mySet);

//Set转Array(使用...)
let mySet = new Set();
mySet.add("乔丹");
mySet.add("皮蓬");
mySet.add("罗德曼");
let arr = [...mySet];
console.log(arr);

//字符串转Set(注:Set中toString方法是不能将Set转换成String)
let mySet = new Set("hello");
console.log(mySet);  //h e l o (两个l只出现一次)

Set对象的作用：

//数组去重复
let mySet = new Set([1,2,1,2,3,3,4,5,6,4,7]);
let arr = [...mySet];
console.log(arr); //1,2,3,4,5,6,7

//数组求并集
let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);
let union = new Set([...a, ...b]);
let arr = [...union];
console.log(arr); //1, 2, 3, 4

//数组求交集
let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);
let intersect = new Set([...a].filter(p=>b.has(p)));
let arr = [...intersect];
console.log(arr); //2, 3

到此这篇关于ES6基础语法之Map和Set对象的文章就介绍到这了。希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • ES6中Set和Map用法实例详解

    本文实例讲述了ES6中Set和Map用法.分享给大家供大家参考,具体如下: Set ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化. // 例一 var set = new Set([1, 2, 3, 4, 4]); [...set] // [1, 2, 3, 4] var s = new Set(); [2, 3, 5, 4, 5, 2, 2].map(x => s.add(x)); fo

  • ES6学习笔记之map、set与数组、对象的对比

    前言 ES5中的数据结构,主要是用Array和Object.在ES6中主要新增了Set和Map数据结构.到目前为止,常用的数据结构有四种Array.Object.Set.Map.下面话不多说了,来一起看看详细的介绍吧. // 数据结构横向对比,增,查,改,删 1.map和数组对比 { let map=new Map(); let array=[]; /**增**/ map.set('t',1); array.push({t:1}); console.info('map-array',map,ar

  • ES6学习笔记之Set和Map数据结构详解

    本文实例讲述了ES6学习笔记之Set和Map数据结构.分享给大家供大家参考,具体如下: 一.Set ES6提供了新的数据结构Set.类似于数组,只不过其成员值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. 1 . Set函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化. var s = new Set(); var set = new Set([1, 2, 3, 4, 4]); [...set] // [1, 2, 3, 4] var items =

  • ES6新特性五：Set与Map的数据结构实例分析

    本文实例讲述了ES6新特性五之Set与Map的数据结构.分享给大家供大家参考,具体如下: 1. Set ① 定义:它类似于数组,但是成员的值都是唯一的,没有重复的值.Set本身是一个构造函数,用来生成Set数据结构. var s = new Set(); [2,3,5,4,5,2,2].map(x => s.add(x)) console.log(s); //Set { 2, 3, 5, 4 } ② 属性和方法 Set结构有以下属性. Set.prototype.constructor:构造函数

  • 详解ES6中的 Set Map 数据结构学习总结

    ES6中的 Set 数据结构 ES6 新增了一种 Set 数据结构.它类似数组. 最重要的一点是 Set中的结构成员没有重复的, 可用这点 一行代码实现数组去重. Set 本身是一个构造函数.通过 new Set() 来创建Set结构. let arr1 = ['Hello', 'World', 'ES6'] let set1 = new Set() arr1.forEach(type => { set1.add(type) }) 通过new Set创建一个Set结构. forEach 遍历ar

  • 一文搞懂ES6中的Map和Set

    Map Map对象保存键值对.任何值(对象或者原始值) 都可以作为一个键或一个值.构造函数Map可以接受一个数组作为参数. Map和Object的区别 •一个Object 的键只能是字符串或者 Symbols,但一个Map 的键可以是任意值. •Map中的键值是有序的(FIFO 原则),而添加到对象中的键则不是. •Map的键值对个数可以从 size 属性获取,而 Object 的键值对个数只能手动计算. •Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突.

  • 详解ES6中的Map与Set集合

    集合的概念以及和数组的区别 其实数组也是集合, 只不过数组的索引是数值类型.当想用非数值类型作为索引时, 数组就无法满足需要了. 而 Map 集合可以保存多个键-值对(key-value),  Set 集合可以保存多个元素. 对Map 和 Set 一般不会逐一遍历其中的元素. Map 一般用来存储需要频繁取用的数据,  Set 一般用来判断某个值是否存在其中. ES 5 中对 Map 和 Set 的模拟方法 在ES 5 中,没有 Set和Map集合, 一般使用对象来模拟这两种集合, 对象的属性作

  • ES6基础语法之Map和Set对象

    一.Map对象 Map 对象保存键值对.任何值(对象或者原始值) 都可以作为一个键或一个值. Map中的键值是有序的. let myMap = new Map(); myMap.set("23","乔丹"); myMap.set("33","皮蓬"); let name = myMap.get("33"); console.log(name); //皮蓬 let has = myMap.has("

  • ES6基础语法之对象用法

    一.对象和属性和方法 JavaScript中对象: var person={name:"Jack",age:20}; 或: var name = "jack"; var age = 20; var person = {name:name,age:age}; console.log(person.age); //20 ES6中的简洁表示: let [name,age]=["jack",20]; let person = {name,age}; //

  • ES6基础语法之数组拓展

    一.Array.of() 将参数中所有值作为元素形成数组: console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4] 参数的值可以为不同的类型: console.log(Array.of(1, '2', true)); // [1, '2', true] 参数为空时返回空数组: console.log(Array.of()); // [] 注意: let arr1 = new Array(10); //是一个长度为10的空数组 let arr2 = A

  • ES6基础语法之模块化介绍

    ES6 引入了模块化, ES6 的模块化分为导出(export) @与导入(import)两个模块. ES6模块化特点: (1)ES6 的模块自动开启严格模式,不管你有没有在模块头部加上 use strict;. (2) 模块中可以导入和导出各种类型的变量,如函数,对象,字符串,数字,布尔值,类等. (3) 每个模块都有自己的上下文,每一个模块内声明的变量都是局部变量,不会污染全局作用域. (4) 每一个模块只加载一次(是单例的), 若再去加载同目录下同文件,直接从内存中读取. 一.export

  • ES6基础语法之class类介绍

    一.class基本语法 JavaScript 语言中,编写一个学生类,代码如下:(prototype可以个对象添加属性和方法) function Student(stuno,stuname) { this.stuno = stuno; this.stuname = stuname; } Student.prototype.stusex = ""; Student.prototype.sayHi = function() { console.log("大家好,我是"+

  • ES6基础语法之函数介绍

    一.函数参数的扩展 ES6支持参数的默认值: function fn(name,age,sex="男") { console.log(`大家好,我是${name},性别${sex},今年${age}岁!`); } fn("刘德华",45); //大家好,我是刘德华,性别男,今年45岁! 传递undefined,取默认值: function fn(name,sex="男",age) { console.log(`大家好,我是${name},性别${

  • ES6基础语法之字符串扩展

    一.字符串的遍历 JS中遍历字符串: var str = "hello,world"; for(var i = 0;i<str.length;i++) { console.log(str[i]); } ES6扩展的遍历字符串方法: let str = "hello,world"; for(let c of str) { console.log(c); } 二.字符串识别.重复.补全 字符串识别: ES6 之前判断字符串是否包含子串,用 indexOf 方法,E

  • Java 基础语法让你弄懂类和对象

    Java 基础语法让你弄懂类和对象

    目录 Java 基础语法 一.类与对象的初步认知 二.类和类的实例化 三.类的成员 1. 字段/属性/成员变量 2. 方法 3. static 关键字 四.封装 1. private 实现封装 2. getter 和 setter 方法 五.构造方法 1. 基本语法 2. this 关键字 六.认识代码块 1. 什么是代码块 2. 本地代码块 3. 实例代码块 4. 静态代码块 七.补充说明 1. toString 方法 2. 匿名对象 八.总结 Java 基础语法 其实在学习 C 语言时就一直

  • ES6基础之数组和对象的拓展实例详解

    本文实例讲述了ES6基础之数组和对象的拓展.分享给大家供大家参考,具体如下: 数组的扩展 1.拓展运算符('...'),它相当于rest参数的逆运算,用于将一个数组转换为用逗号分隔的参数序列: console.log(...[1, 2, 3]) // 1 2 3 console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 2.如果扩展运算符后面是一个空数组,则不产生任何效果: [...[], 1] // [1] 3.常见的拓展运算符的应用: //合并数组 let a

  • ES6基础之 Promise 对象用法实例详解

    本文实例讲述了ES6基础之 Promise 对象用法.分享给大家供大家参考,具体如下: Promise 对象 1.Promise对象是ES6对异步编程的一种解决方案,它有以下两个特点: Promise对象代表一个异步操作,它只有三种状态:Pending(进行中).Resolved(已完成,又称 Fulfilled)和Rejected(已失败),并且该状态不会受外界的影响 Promise对象的状态改变,只有两种可能:从 Pending 变为 Resolved 或者从 Pending 变为 Reje

随机推荐