JavaScript 箭头函数、函数参数

箭头函数：

• 箭头函数是一种更加简洁的函数书写方式
• 箭头函数本身没有作用域（无this）
• 箭头函数的this指向上一层，上下文决定其this
• 基本语法：参数 => 函数体

a. 基本用法

let fn = v => v;
//等价于
let fn = function(num){return num;
}
fn(100);  // 输出100

b. 带参数的写法

let fn2 = (num1,num2) => {let result = num1 + num2;return result;
}
fn2(3,2);  // 输出5

c. 箭头函数中的this指向问题

• 箭头函数体中的 this 对象，是定义函数时的对象，而不是使用函数时的对象。在函数定义的时候就已经决定了

function fn3(){setTimeout(()=>{// 定义时，this 绑定的是 fn3 中的 this 对象console.log(this.a);},0)
}
var a = 10;
// fn3 的 this 对象为 {a: 10}，因为它指向全局: window.a
fn3.call({a: 18});  // 改变this指向，此时 a = 18

d. 箭头函数适用的场景

• 当我们代码里存在这样的代码：let self = this;
• 需要新建变量去保存this的时候
• 案例如下：

let Person1 = {'age': 18,'sayHello': function () {setTimeout(()=>{console.log(this.age);});}
};
var age = 20;
Person1.sayHello();  // 18

函数参数：

1. 默认参数

// num为默认参数，如果不传，则默认为10
function fn(type, num=10){console.log(type, num);
}
fn(1);	// 打印 1，10
fn(1,2); // 打印 1，2 （此值会覆盖默认参数10）

• 需要注意的是：只有在未传递参数，或者参数为 undefined 时，才会使用默认参数，null 值被认为是有效的值传递。

2. 不定参数

// 此处的values是不定的，且无论你传多少个
function f(...values){console.log(values.length);
}
f(1,2);      // 2
f(1,2,3,4);  // 4