1、Symbol

ES5 的对象属性名都是字符串,这容易造成属性名的冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。

 {
//声明
let a1=Symbol();
let a2=Symbol();
console.log(a1===a2) //false,生成的a1跟a2都是独一无二
let a3=Symbol.for('a3'); //Symbol.for()里面有key时,先全局搜索一下,有的话就直接赋值,没有的话就生成一个a3的变量
let a4=Symbol.for('a3');
console.log(a3===a4); //true
} // 应用场景
{
let a1=Symbol.for('abc');
let obj={
[a1]:'',
'abc':,
'c':
}
console.log("obj",obj) //{abc:'123',Symbol('abc'):345,c:456}
}

2、数据结构

Set-Map数据结构

定义:类似于数组的数据结构,成员值都是唯一且没有重复的值,数据结构====》》{"a", "b", "e", "f", "d"}

应用场景

去重字符串:[...new Set(str)].join("")
去重数组:[...new Set(arr)]或Array.from(new Set(arr))

知识点1:set集合

add()新增

{
let list = new Set();
list.add();
list.add();
console.log('size',list.size); // 2 size计算长度
}
{
let list = new Set();
list.add();
list.add();
list.add();
console.log('list',list); //list Set(2) {1, 2} // 不允许成员重复,所以还是[1、2]
}

应用场景去重,但是不做数据类型转换!!

// 应用场景去重
{
let arr=[,,,,,];
let list=new Set(arr); console.log('unique',list); //1,2,3,4 }
//set去重不做数据类型转换
{
let arr2=[,,,,,''];
let list2=new Set(arr2); console.log('unique',list2); //1,2,3,4,'2' }

Set的几个方法 (add,delete,clear,has

{
let arr=['add','delete','clear','has'];
let list=new Set(arr); console.log('has',list.has('add')); //ture 是否存在这个元素
console.log('delete',list.delete('add'),list); //Set(3) {"delete", "clear", "has"} //删除某个元素
list.clear(); //Set(0) {} 清空元素
console.log('list',list); //Set(0) {} //数据如果存在。set直接修改数据本身,它只是引用,要是不确定的话,要用forEach来循环
}

Set遍历的方法(其中val值跟key值相同)

{
let arr=['add','delete','clear','has'];
let list=new Set(arr);
for(let key of list.keys()){
console.log('keys',key);
}
for(let value of list.values()){
console.log('values',value);
}
for(let [key,value] of list.entries()){
console.log('entries',key,value);
}
list.forEach(function(item){console.log(item);})
}

weakSet 和set支持的数据对象不同。weakSet必须是对象,其它不支持。是弱引用

3、Map()数据结构

map()跟set()的区别是map的key值可以是任何数据类型,而set的key值类型只能是字符串。set添加字符串的方法是add(),而map添加属性的方法是set()以键值的形式。获取的方法是get()!其它的查也是has(),删也是delete()!!!!

map的定义方式1,不带参数

{
let map = new Map();
let arr=[''];
map.set(arr,);
console.log('map',map,map.get(arr)); //Map(1) {Array(1) => 456} 456
}

map的定义方式2,带参数

{
let map = new Map([['a',],['b',]]); //注意格式
console.log('map args',map); //map args Map(2) {"a" => 123, "b" => 456}
console.log('size',map.size); //里面元素个数
console.log('delete',map.delete('a'),map);
console.log('clear',map.clear(),map);
}

4、数据结构Map跟Set与数组array跟对象Object的对比

增、删、改、查

map与数组比较

{
// 数据结构横向对比,增,查,改,删
let map=new Map();
let array=[];
// 增
map.set('t',);
array.push({t:}); console.info('map-array',map,array) //map-array Map(1) {"t" => 1} [{t,1}] // 查
let map_exist=map.has('t');
let array_exist=array.find(item=>item.t);
console.info('map-array',map_exist,array_exist); // 改
map.set("t",);
array.forEach(item=>item.t?:'');
console.info('map-array-modify',map,array); // 删
map.delete('t');
let index=array.findIndex(item=>item.t);
array.splice(index,);
console.log('map-array-delete',map,array);
}

set与数组比较

{
let set=new Set();
let array=[];
// 增
set.add({t:});
array.push({t:}); console.info('set-array',set,array); //查
let set_exist=set.has({t:});
let array_exist=array.find(item=>item.t);
console.info('set-array',set_exist,array_exist); //改
set.forEach(item=>item.t?item.t=:'');
array.forEach(item=>item.t?item.t=:'');
console.info('map-array-modify',set,array); //删
set.forEach(item=>item.t?set.delete(item):'');
let index=array.findIndex(item=>item.t);
array.splice(index,);
console.info('map-array-empty',set,array);
}

set、map与对象比较

{
let item={'t':};
let set=new Set(); //唯一性时考虑
let map=new Map(); //优先考虑
let obj={}; //增
set.add(item);
map.set('t',);
obj['t']=; console.log('map-set-obj',obj,map,set); // 查
console.info({
map_exist:map.has('t'),
set_exist:set.has(item),
obj_exist:'t' in obj
}) // 改
map.set('t',);
item.t=; //set直接修改数据类型
obj['t']=;
console.log('map-set-obj-modify',obj,map,set); // 删除
map.delete('t');
set.delete(item);
delete obj['t'];
console.log('map-set-obj-empty',obj,map,set); }

ES6学习笔记三的更多相关文章

  1. ES6学习笔记<三> 生成器函数与yield

    为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...

  2. ES6学习笔记三:Symbol、Set、Map

    一:Symbol ES6 引入了一种新的原始数据类型Symbol,表示独一无二的值.它是 JavaScript 语言的第七种数据类型,前六种是:undefined.null.布尔值(Boolean). ...

  3. ES6学习笔记(三)——数值的扩展

    看到这条条目录有没有感觉很枯燥,觉得自己的工作中还用不到它所以实在没有耐心看下去,我也是最近得闲,逼自己静下心来去学习去总结,只有在别人浮躁的时候你能静下心来去学去看去总结,你才能进步.毕竟作为前端不 ...

  4. ES6学习笔记三(proxy和reflect)

    proxy用法 // 代理 { let obj={ time:'2017-03-11', name:'net', _r: }; let monitor=new Proxy(obj,{ // 拦截对象属 ...

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

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

  6. ES6学习笔记<四> default、rest、Multi-line Strings

    default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...

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

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

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

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

  9. ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能

    前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...

随机推荐

  1. Spring项目集成ShiroFilter简单配置

    Shiros是我们开发中常用的用来实现权限控制的一种工具包,它主要有认证.授权.加密.会话管理.与Web集成.缓存等功能.我是从事javaweb工作的,我就经常遇到需要实现权限控制的项目,之前我们都是 ...

  2. System.Web.Optimization 合并压缩技术的使用

    捆绑和压缩原理是:将多个css文件动态合并和压缩为一个css文件.多个js文件动态合并和压缩为一个js文件,如此达到减少浏览器对服务器资源文件的请求数量.缩小资源文件的尺寸来提高页面反应速度的目的.A ...

  3. Linux 内核里的数据结构:双向链表

    原文:https://blog.csdn.net/qq_33487044/article/details/78827260 双向链表 Linux 内核自己实现了双向链表,可以在 include/lin ...

  4. Swagger入门

    新手入门Swagger看了很多博客,竟然没有一个是步骤齐全的或直接能运行的.于是CSDN下载了SSM+Swagger整合的demo,一顿瞎整,终于可以运行了. 不容易,因此分享这篇博客,祝新手朋友们早 ...

  5. MySQL中innodb_flush_log_at_trx_commit的设置

    innodb_flush_log_at_trx_commit=0,在提交事务时,InnoDB不会立即触发将缓存日志写到磁盘文件的操作,而是每秒触发一次缓存日志回写磁盘操作,并调用操作系统fsync刷新 ...

  6. Part-Ten

    1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12.

  7. svn Edge访问规则配置

    权限的配置方法: 首先在用户页面定义用户,然后在版本库页面,手工填写访问规则. 以下面的配置为例(实际配置中应删除“//”及其后的注释): [groups]               //定义用户组 ...

  8. 040、Docker managed volume(2019-03-01 周五)

    参考https://www.cnblogs.com/CloudMan6/p/7152775.html   docker managed volume 与bind mount 在使用上最大的区别是不需要 ...

  9. Web服务调试可用,发布之后访问出错

    今天重装了系统,然后发现之前的Web服务DataService不能用了.将其设置为启动项,运行的结果是 跟踪发现,是mysql.data.dll的版本不对.所以要找到所有版本不对的该dll,将其替换成 ...

  10. Gossip

    http://www.cnblogs.com/xingzc/p/6165084.html 敬请期待...