ES6参数默认值、剩余参数、展开运算符、明确函数、箭头函数最全解剖

参数默认值

1、在书写形参时,直接给形参赋值,赋的值即为默认值
2、这样一来,如果没有给对应的参数赋值(给它的值是undefined),则会自动使用默认值
扩展】对arguments的影响
只要给函数加上参数默认值,该函数会自动变量严格模式下的规则:
arguments和形参脱离
扩展】留意暂时性死区
形参和ES6中的let或const声明一样,具有作用域,并且根据参数的声明顺序,存在暂时性死区

剩余参数

背景
以往arguments存在缺陷:
1、如果和形参配合使用,容易导致混乱
2、从语义上,使用arguments获取参数,由于形参缺失,无法从函数定义上理解函数的真实意图
解决手段
ES6的剩余参数的出现就是为了解决以上的larguments存在的问题,剩余参数专门用于收集末尾的所有参数,将其放置到一个形参数组中。
语法:
function(…形参名){
//
}
注意点
一个函数仅能出现一个剩余参数

展开运算符

使用方式:...要展开的东西
可以对数组里面的数据进行展开,也可以对对象的东西进行展开运算

明确函数

ES6提供了一个特殊的API明确函数,可以使用该API在函数内部,判断该函数是否使用了new来调用
new.target
//该表达式,得到的是:如果没有使用new来调用函数,则返回undefined
//如果使用new调用函数,则得到的是new关键字后面的函数本身

箭头函数

回顾this指向
1、通过对象调用函数,this指向对象
2、直接调用函数,this指向全局对象
3、如果通过new调用函数,this指向新创建的对象
4、如果通过apply、call、bind调用函数,this指向指定的数据
5、如果是DOM事件函数,this指向事件源
使用语法:
箭头函数是一个函数表达式,理论上,任何使用函数表达式的场景都可以使用箭头函数
完整语法:
(参数1,参数2,…) => {
//函数体
}
如果参数只有一个,可以省略小括号
参数 => {

}
如果箭头函数只有一条返回语句,可以省略大括号,和return关键字
参数 => 返回值

注意细节:
箭头函数的函数体中的this,取决于箭头函数定义的位置的this指向,而与如何调用无关
!!!箭头函数中,不存在this、arguments、new.target,如果使用了,则使用的是函数外层的对应的this、arguments、new.targer
箭头函数没有原型!!!所以不能作为构造函数去使用
应用场景
1、临时性使用的函数,并不会刻意调用它,比如:
1、事件处理函数
2、异步处理函数
3、其他临时性的函数
2、为了绑定外层this的函数
3、在不影响其他代码的情况下,爆出代码的简洁。最常见的: 数组方法中的回调函数

发布了6 篇原创文章 · 获赞 0 · 访问量 80

猜你喜欢

转载自blog.csdn.net/weixin_42602873/article/details/104667628