一、基本语法:
ES6允许使用“箭头”(=>)定义函数
var f = a = > a
//等同于
var f = function(a){
return a;
}
如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。
//无形参
var f = () => 5;
// 等同于
var f = function () { return 5 };
//多个形参
var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
return num1 + num2;
};
二、使用箭头函数注意点:
箭头函数有几个使用注意点。
(1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
var name = '张三';
var person = {
name:'李四',
age:18,
fav:function(){
console.log(this)
console.log(this.name) //李四
}
}
person.fav();
(2)此时this指向的是使用它的对象,也就是person对象
var person2 = {
name:'李四',
age:18,
fav: ()=>{
// 当前this指向了定义时所在的对象(window)
console.log(this); // window
}
}
person2.fav();
(3)
普通函数中的this:
代表它的直接调用者(js的this是执行上下文), 例如 obj.cal() ,那么cal()方法中的this就是obj。
若没找到直接调用者,则this指的是 window (常见的window的属性和方法有: alert, location,document,parseInt,setTimeout,setInterval等)或者 undefined。
箭头函数中的this:
箭头函数没有自己的this, 它的this是继承而来; 默认指向在定义它时所处的
对象(宿主对象)。即箭头函数中的this指向外层调用者。
总结:普通函数中的this指向 它的直接调用者;箭头函数中的this指向 它的外层调用者。
那麽问题来了,在什么情况下使用箭头函数呢?
当把一个函数的结果(返回值)作为另一个函数的参数的时候。