javascript-es6 (二)
函数进阶
函数提升
函数提升与变量提升比较类似,是指函数在声明之前即可被调用
好处:能够使函数的声明调用更灵活
函数提升出现在
相同作用域
当中
//可调用函数
fn()
//后声明函数
function fn() {
console.log('可先调用再声明')
}
注意:函数表达式不存在提升的现象
//调用表达式,不存在提升现象
bar() //错误
var bar = function() {
console.log('函数表达式不存在提升哦')
}
函数参数
动态参数
arguments
是函数内部内置的伪数组变量,它包含了调用函数时传入的所有实参
function sum() {
// console.log(arguments) arguments是伪数组
let s = 0
for (let i = 0; i < arguments.length; i++) {
s += arguments[i]
}
console.log(s)
}
sum(3, 3) //6
总结:
1.
arguments 是一个伪数组,
只存在于函数中
2.
arguments 的作用是动态获取函数的实参
3.
可以通过for循环依次得到传递过来的实参
剩余参数
(提倡使用)
剩余参数允许我们将一个不定数量的参数表示为一个数组
function getSum(...other) {
console.log(other) //使用的时候不需要写...
//other 得到 [1,2,3]
}
getSum(1,2,3)
- ... 是语法符号,置于最末函数形参之前,用于获取多余的实参
- 借助 ... 获取的剩余实参,是个真数组,只存在于函数中
function getSum(a,b,...other) {
console.log(a,b,other) //里面的 other 也可以换成其他字母哦
}
getSum(1,2,3,4) //1 2 [3,4]
展开运算符(…)
数组中使用,
将一个数组进行展开,不会修改原数组
典型运用场景:
求数组最大值(最小值)
const arr = [1,2,3,4]
console.log(...arr) //1 2 3 4
//...arr === 1,2,3,4
console.log(Math.max(...arr)) //4
console.log(Math.min(..arr)) //1
合并数组
const arr1 = [1,2]
const arr2 = [3,4]
const arr3 = [...arr1,...arr2]
console.log(arr3) //[1,2,3,4]
箭头函数(重要)
引入箭头函数的目的是更简短的函数写法并且不绑定this,箭头函数的语法比函数表达式更简洁
更适用于那些本来
需要匿名函数的地方
基本写法
//普通写法
const fn = function () {
console.log('我是普通函数哦')
}
fn()
//箭头函数
const fn = () => {
console.log('俺是箭头函数')
}
fn()
只有一个参数可以省略小括号
//普通函数
const fn = function (x) {
return x + x
}
consle.log(fn(1)) //2
//箭头函数
const fn = x => {
return x + x
}
console.log(fn(1)) //2
如果函数体只有一行代码,可以写到一行上,并且无需写 return 直接返回值