打开APP
未登录
开通VIP,畅享免费电子书等14项超值服
开通VIP
首页
好书
留言交流
下载APP
联系客服
Es6B - 箭头函数/set/map结构
AnXuelin295
>《待分类》
2021.01.19
关注
箭头函数
注意:
1.只含有1个表达式
2.含有多条语句
3.this的指向问题
我们还是先来看Es5的函数定义写法:
运行结果如下:
再来看Es6用箭头定义函数的写法:
运行结果相同,如下:
Es6箭头函数要比Es5的普通写法简便许多
如果是
多条语句,并且在传一定的参数情况下
,该如何写:
传递参数:
运行结果如下:
如果后面有其他语句的话,不单单是返回这一个值:
例如,我们通过函数求a*b的值:
运行结果如下:
this指向问题【重点/难点】
还是先来看一下Es5和Es6编写的区别:
普通函数this是指向window的:
运行结果如下:
如果在对象里面使用的话:
运行结果如下:
如果我们来换一种Es6的函数写法:
运行结果如下:
这里面的this是指向定义时所在的作用域,而不是执行时所在的作用域
即:输出什么就指向什么!!!
我们再来举个例子:
此时用的function,返回Es5的结果
,即Axl
运行结果如下:
我们添加一个console.log(this);来看一下返回什么:
我们来对比一下,运行结果如下:
我们来改成Es6的写法:
运行结果如下:
set结构
定义方式:
与
定义数组差不多
,但是
它会自动去除重复的值
举个小例子:
运行结果如下:
会自动去除重复的2
… 扩展运算符:
可以将set结构转换为数组
运行结果如下:
这时
set又转为了数组类型
set的遍历:
我们都知道数组可以通过for或for
…in进行遍历
set的遍历,有另一种遍历方式
:
for…of
运行结果如下:
除了这些set还提供了一些属性和实用方法:
1.set.size //长度
2.set.add (0) //新增元素
3.set.delete (0) //删除元素
5.set.has (0) //是否含有某一个元素
6.set.clear () //清空
我们来具体看一下:
运行结果如下:
还有一些方法,有具体的返回值:
1.keys() //返回键名的遍历器
2.values() //返回键值的遍历器
3.entries() //返回键值对的遍历器
4.forEach() //使用回调函数遍历每个成员
我们来具体看一下:
运行结果如下:
map结构
定义方式:
set类似于数组结构
,
map类似于对象结构
运行结果如下:
在定义的时候我们就创建了name和age两个属性,
如果我们想要追加的话:
map.set( )直接追加即可
运行结果如下:
它和set同样具有相同的属性和方法,不再具体细说,简单一写带过:
不同之处在于,他
没有map.add添加元素,只有map.set追加元素
并且没有map.has查看
运行结果如下:
-
写作不易,大家多多关注,谢谢啦
-
---web
分享,分享的不只是
web
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请
点击举报
。
打开APP,阅读全文并永久保存
查看更多类似文章
猜你喜欢
类似文章
找出两数组的不同
es6新增新特性简要总结
PHP数组操作汇总 php数组的使用技巧
引用 MATLAB 快捷键
ES6新特性(2)之Symbol/Set/WeakSet
【转】C++STL 常用 函数 用法
更多类似文章 >>
生活服务
热点新闻
留言交流
回顶部
联系我们
分享
收藏
点击这里,查看已保存的文章
导长图
关注
一键复制
下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!
联系客服
微信登录中...
请勿关闭此页面
先别划走!
送你5元优惠券,购买VIP限时立减!
5
元
优惠券
优惠券还有
10:00
过期
马上使用
×