一、Map,Set,Array对比:

1、增

    let map = new Map();
let set = new Set();
let array = []; map.set('t',1); //Map
set.add({t:1}); //Set
array.push({t:1});//数组
console.info('set-map-array',set,map,array);

2、查

   let map_exist = map.has('t');
let set_exist = set.has({t:1});
let array_exist = array.find(item=>item.t)
console.info('map-set-array',map_exist,set_exist,array_exist);
//true(返回布尔值) false 返回的是查找的值

3、改

   map.set('t',2);
set.forEach(item=>item.t?item.t=2:'');//set 修改也是通过forEach
array.forEach(item=>item.t?item.t=2:'');
console.info('map-set-array-modify',map,set,array);

4、删除

   map.delete('t');
set.forEach(item=>item.t?set.delete(item):'');//set删除也是通过forEach
let index = array.findIndex(item=>item.t);
array.splice(index,1);
console.info('map-set-array-modify',map,set,array);

二、Map、Set、Object对比:

1、新增

    let item = {t:1};
let map = new Map();
let set = new Set();
let obj = {}; map.set('t',1);
set.add(item);
obj['t'] = 1;
console.info('map-set-ogj',map,set,obj)

2、查找

console.info({
map_exist:map.has('t'),
set_exist:set.has(item),
obj_exist:'t' in obj
})

3、修改

map.set('t',2);
item.t = 2; //直接修改item
obj['t'] = 2;
console.info('map-set-obj-modify',map,set,obj)

4、删除

map.delete('t');
set.delete(item);
delete(obj.t)
console.info('map-set-obj-empty',map,set,obj)

Map成本低,Set如果在使用过程中没有对数据做一份引用的话,就要通过forEach删除,优先使用Map,如果对数据结构要求存储的唯一性比较高使用Set,放弃使用数组和object。

JavaScript(ES6)学习笔记-Set和Map与数组和对象的比较(二)的更多相关文章

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

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

  2. ES6学习笔记之变量的解构赋值

    变量的解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构. 数组的解构赋值 以前,为变量赋值,只能直接指定值: 1 2 3 var a = 1; var b = 2; ...

  3. JS&ES6学习笔记(持续更新)

    ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...

  4. es6学习笔记--解构赋值

    昨天学习了es6语法中解构赋值,解构赋值在声明中和函数传参提高了灵活性和便捷性,值得掌握该语法. 概念: ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构.   数组的解构 ...

  5. JavaScript正则表达式学习笔记(二) - 打怪升级

    本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...

  6. es6学习笔记-class之一概念

    前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ...

  7. ES6学习笔记<五> Module的操作——import、export、as

    import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...

  8. ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring

    接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...

  9. ES6学习笔记<一> let const class extends super

    学习参考地址1  学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...

随机推荐

  1. 2018-2019-2 网络对抗技术 20165316 Exp5 MSF基础应用

    2018-2019-2 网络对抗技术 20165316 Exp5 MSF基础应用 目录 原理与实践说明 实践原理 实践内容概述 基础问题回答 攻击实例 主动攻击的实践 ms08_067_netapi: ...

  2. asp.net(c#)网页跳转 方法小结

    返回 打印 asp.net(c#)网页跳转七种方法小结_实用技巧_脚本之家 在asp.net下,经常需要页面的跳转,下面是具体的几种方法.跳转页面是大部编辑语言中都会有的,正面我们来分别介绍一下关于. ...

  3. 关于.vbs文件恶搞,小伙伴电脑的

    这是,VBS是基于Visual Basic的脚本语言.VBS的全称是:Microsoft Visual Basic Script Edition.(微软公司可视化BASIC脚本版). 其语言类似Vis ...

  4. phpstudy-5.6.27-nts 安装redis扩展

    redis扩展安装流程 第一步: 首先直接查看一下phpinfo()的信息 找到下面两条信息 Architecture x86 PHP Extension Build API20131226,NTS, ...

  5. php,js 对字符串按位异或运算加密解密

    异或的符号是^.按位异或运算, 对等长二进制模式按位或二进制数的每一位执行逻辑按位异或操作. 操作的结果是如果某位不同则该位为1, 否则该位为0. xor运算的逆运算是它本身,也就是说两次异或同一个数 ...

  6. 不小心跳进安装Django-redis的坑

    为了写缓存这一块,我用pip install django-redis安装Django-redis. 它也把我的Django更新到最新了,我回头看下面的截图才发现的,把我的Django从1.8.2更新 ...

  7. Bigger-Mai 养成计划,Python基础巩固二

    模块初识1.标准库2.第三方库import sys sys.path #自己的本文件名不可为sys.py#输出模块存储的环境变量sys.argv #打印脚本的相对路径sys.argv[2] #取第二个 ...

  8. C#中的反射解析及使用(转)

    原文:https://cloud.tencent.com/developer/article/1129356 1.对C#反射机制的理解 2.概念理解后,必须找到方法去完成,给出管理的主要语法 3.最终 ...

  9. 关于 Expression is not assignable 错误

    1.在 Build Phases中导入  UIKit.framework 2.在pch中导入头文件 #import <UIKit/UIKit.h> 3.写一个分类 即可解决 贴出分类代码 ...

  10. React---简单实现表单点击提交插入、删除操作

    import React,{Component,Fragment} from 'react' class App extends Component { constructor(){ super() ...