function新特性
Default Parameters
对于函数而言，经常会用到参数，关于参数的默认值通常写在函数体内。函数
函数参数是为从左到右解析，没有默认值会被解析为undefined
ES5默认参数写法，过于臃肿，且重复
function f (x, y, z) {
if (y === undefined)
y = 7;
if (z === undefined)
z = 42;
return x + y + z;
};
f(1) === 50;
ES6默认参数写法，有默认值参数一般写在无默认值参数之后。（即使不按顺序写，现在也不报错，）
function f (x, y = 7, z = 42) {
return x + y + z
}
console.log(f(1, undefined, 43))// 51
//从左向右解析，想让某个参数使用默认值，就使用undefined来赋值
function f (x, y = 7, z = 42, h = 5) {
return x + y + z+ h
}
console.log(f(1, undefined, 43))// 56
//从左向右解析，如果有剩余参数未传入值，也按默认值处理
ES6中参数可以用于后面的参数的逻辑计算进行赋值
function f (x, y = 7, z = x + y) {
return z * 0.5
}
console.log(f(1, 7))// 4
在函数体内的函数声明不能引用内部的默认参数，会报错。
// Doesn't work! Throws ReferenceError.
function f(a = go()) {
function go() { return ':P'; }
}
还可以通过解构赋值为参数赋值
function f([x, y] = [1, 2], {z: z} = {z: 3}) {
return x + y + z;
}
f(); // 6
arguments改动
判断函数体内有几个参数
ES5 中可以在函数体内使用 arguments 来判断
function test (a, b = 1, c) {
console.log(arguments.length)
}
test('a', 'b')//2
ES6 中不能再使用 arguments 来判断了，但可以借助 Function.length 来判断，但是只能统计一个默认参数之前的变量数
function test (a, b = 1, c) {
console.log(test.length)
}
test('a', 'b')// 1
Rest Parameter（Rest 参数）
ES5中，不确定剩余参数有多少个，或不需要知道剩余参数都是什么玩意的情况下进行逻辑运算
比如求和运算
function sum () {
let num = 0
Array.prototype.forEach.call(arguments, function (item) {
num += item * 1
})
return num
}
console.log(sum(1, 2, 3))// 6
console.log(sum(1, 2, 3, 4))// 10
ES6中arguments不好使，提供了新的方式.即rest 参数。
rest 参数之后不能再有其他参数，且函数的 length 属性，不包括rest参数
function sum (...nums) {
let num = 0
nums.forEach(function (item) {
num += item * 1
})
return num
}
console.log(sum(1, 2, 3))// 6
console.log(sum(1, 2, 3, 4))// 10
//...nums（Rest Paramete）代表参数的集合，并且是一个数组
Rest Paramete也可以和其他参数一起来使用
function sum (base, ...nums) {
let num = base
nums.forEach(function (item) {
num += item * 1
})
return num
}
console.log(sum(30, 1, 2, 3))// 36
console.log(sum(30, 1, 2, 3, 4))// 40
Rest参数和arguments对象的区别：
1.rest参数只包括那些没有给出名称的参数，arguments包含所有参数
2.arguments 对象不是真正的数组，而rest 参数是数组实例，可以直接应用sort, map, forEach, pop等方法
3.arguments 对象拥有一些自己额外的功能
Spread Operator（扩展运算符）
很方便易懂的语法，把固定的数组内容“打散”到对应的参数
function sum (x = 1, y = 2, z = 3) {
return x + y + z
}
console.log(sum(...[4]))// 9
console.log(sum(...[4, 5]))// 12
console.log(sum(...[4, 5, 6]))// 15
Arrow Function（箭头函数）
ES5函数必须使用function。而箭头函数不需要，并且使函数简短。
let hello = () => {
console.log('say hello')
}
箭头函数的语法示例
(param1, param2, …, paramN) => { statements }
(param1, param2, …, paramN) => expression
//相当于：(param1, param2, …, paramN) =>{ return expression; }
// 当只有一个参数时，圆括号是可选的：
(singleParam) => { statements }
singleParam => { statements }
// 没有参数的函数应该写成一对圆括号。
() => { statements }
//加括号的函数体返回对象字面量表达式：
params => ({foo: bar})
//支持剩余参数和默认参数
(param1, param2, ...rest) => { statements }
(param1 = defaultValue1, param2, …, paramN = defaultValueN) => {
statements }
//同样支持参数列表解构
let f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c;
f(); // 6
箭头函数的this问题
箭头函数不会创建自己的this它只会从自己的作用域链的上一层继承this
let test = {
name: 'test',
say: () => {
console.log(this.name, this)
}
}
console.log(test.say())// undefined
//this 的指向也就是 test 外层的所指向的 window，而 window 没有 name 属性，所以结果是 undefined
由于 箭头函数没有自己的this指针，通过 call()或 apply() 方法调用一个函数时，只能传递参数（不能绑定this），他们的第一个参数会被忽略
var adder = {
base : 1,
add : function(a) {
var f = v => v + this.base;
return f(a);
},
addThruCall: function(a) {
var f = v => v + this.base;
var b = {
base : 2
};
return f.call(b, a);
}
};
console.log(adder.add(1)); // 输出 2
console.log(adder.addThruCall(1)); // 仍然输出 2