ES6常用语法2

本文详细介绍了ES6中的for of循环,包括其与for in的区别以及如何遍历对象。接着,探讨了ES6引入的基础数据类型Symbol,强调其唯一性和在对象属性定义中的应用。此外,还讨论了两种新的数据结构Set和Map,特别是它们在数据去重和存储任意键值对方面的优势。最后,提到了ES6的新运算符,如指数运算和位运算,及其高效性。
摘要由CSDN通过智能技术生成

一、for of(ES6)
1.了解for in遍历数组
key数组的下标,arry数组
在这里插入图片描述
在这里插入图片描述

for in在ES5中的作用是遍历对象的,但是for in可以遍历出原型上面的属性

//for in在ES5中的作用是遍历对象的
let onj={
	name;"小菜",
	age:19,
	sex:"女",
	company:"xxx"
}
for(let key in obj){
	console.log(key);//name age sex company
	console.log(key,obj.[key]);//name 小菜 age 18 sex 女 company xxx
}

2.for of(ES6)
for of 遍历数组是直接遍历出数组中的每一项的值,但是不可以直接遍历对象
在这里插入图片描述
在这里插入图片描述
3.ES6中for of遍历对象的方法使用
Object.keys(传入一个参数) 遍历,得到的是每一属性
Object.value(),得到的是每一个值
Object.entries,得到的是每一个数组,目的是遍历对象,得到一个拥有迭代器接口的数据,迭代器保存着key和value的值===>常用

for(let key of Object.keys(obj)){
               console.log(key);//name age sex company
                //得到的是每一属性
            }
            for(let key of Object.values(obj)){
                console.log(key);//name age sex company
                //得到的是每一个值
            }
            for(let key of Object.entries(obj)){
                console.log(key);//name 小菜 age 19 sex 女 copany xxx
                //Object.entries得到的是每一个数组
            }
            for(let [key,value] of Object.entries(obj)){
                //使用解构赋值[key,value]
                console.log(key,value);//name 小菜 age 19 sex 女 copany xxx
            }

二、ES6数据类型
1.ES5数据类型:
基础数据类型: undefined null number string boolean
复杂(引用)数据类型:object
2.ES6基础数据类型:Symbol
1)创建Symbol
在这里插入图片描述
在这里插入图片描述
2)特点:两个不同的Symbol数据绝对不相等
在这里插入图片描述
3)Symbol的作用,需提及对象的属性
一般的对象属性只能由字符串来定义的属性,而在ES6中不仅仅是一个字符串,还拥有Symbol的值
例如:

   let obj={
                name:"小菜"
            };
       obj[Symbol()]="小可爱";//给obj赋值一个Symbol
       console.log(obj);

在这里插入图片描述
4)Symbol的作用,具有唯一性,是对数据的处理,可以避免属性(数据)的覆盖,便于扩展对象/减少不需要的数据
例如:扩展对象属性
在这里插入图片描述
例如:不必担心冲突
在这里插入图片描述
在这里插入图片描述
5)取值(调用)
在这里插入图片描述
在这里插入图片描述
不可以使用Symbol来取值,因为Symbol具有唯一性
例如:无意义的操作,取不出Symbol的值,若要取值,则需通过定义变量(for of遍历来取)来取值
在这里插入图片描述
在这里插入图片描述
通过变量取值
在这里插入图片描述
6)其他的写法,对Symbol(描述作用,无实际的影响),方便找错误点
在这里插入图片描述
在这里插入图片描述

三、ES6中新增的两种数据结构(例如数组就是一种数据结构)
1.Set
1)作用是创建一种新的数据结构,在定义的Set,并且需要传值,这个值为数组

let  data=new Set([1,2,3,4,5]);
console.log(data);//存了六条数据的结构

在这里插入图片描述
2)Set最大作用===>去重(去掉重复的数据),不用再使用算法去重
例如
在这里插入图片描述
在这里插入图片描述
3)Set结构拥有迭代器的,可以使用“…”的扩展运算符,把去重后的数据,重新得到新的数组
’例如:
在这里插入图片描述
在这里插入图片描述
4)Set内部存储的一些方法(买油)
add增加
在这里插入图片描述
在这里插入图片描述
delete删除
在这里插入图片描述
在这里插入图片描述
clear清空
在这里插入图片描述
在这里插入图片描述
entries接口,可以使用for of
在这里插入图片描述
在这里插入图片描述

2.新的数据类型Map(使用在框架的底层原理的开发)
允许任何数据作为键值(解决了对象不能作为键的问题)
1)在对象中,字符串也可以作为属性,但是在对象中的属性不可以是对象,所以如果是对象属性则会强制转换成字符串
在object中能够成为键的,只能是一个字符串或者是数字和symbol
在这里插入图片描述
在这里插入图片描述
2)Map允许任何数据作为键值
在这里插入图片描述
设置在这里插入图片描述
在这里插入图片描述
取值某一个键对应的值
在这里插入图片描述

四、运算符
1.乘乘==>指数运算
在这里插入图片描述
在这里插入图片描述
2.位运算===效率是最高的
1)| 或运算符,按位或。先通过2进制进行转换再使用js中的32位运算进行运算,并且任意一个数或上0,则是数本身,但小数或上则是整数(取整:记住)
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
2)异或 按位,两位相同为0,不同为1
在这里插入图片描述
3)& 按位&,与运算,两位都同为1则是1,不同则为0
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值