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