- 箭头函数相当与匿名函数
- 用变量接收箭头函数
- 带一个参数的箭头函数
- 带多个参数的箭头函数
- 有返回值的箭头函数
- 有返回值并且带参的箭头函数
- 有返回值并且带多个参的箭头函数
- 返回对象的箭头函数
- 返回对象并且带參的箭头函数
- 包含多条语句并且有返回值的箭头函数
- 箭头函数和匿名函数的区别
ES6标准新增了一种新的函数：Arrow Function（箭头函数）。
为什么叫Arrow Function？因为它的定义用的就是一个箭头：
x => x * x
上面的箭头函数相当于：
function (x) { return x * x; }
箭头函数相当与匿名函数
() => {
console.log('箭头函数被调用了');
}
相当于
function (){
console.log('匿名函数被调用了');
})
用变量接收箭头函数
var a = () => {
console.log('箭头函数被调用了');
}
相当于
function a(){
console.log('匿名函数被调用了');
})
带一个参数的箭头函数
x => {
console.log('带一个参数的箭头函数被调用了，参数是：'+x)
}
相当于
function (x){
console.log('带一个参数的匿名函数被调用了，参数是：'+x);
}
带多个参数的箭头函数
(x,y) => {
console.log('带多个参数的箭头函数被调用了，参数是：'+x,y)
}
相当于
function (x, y) {
console.log('带多个参数的匿名函数被调用了，参数是：' + x, y);
}
有返回值的箭头函数
() => {
return 1
};
相当于
() => (1);
相当于
function () {
return 1;
}
有返回值并且带参的箭头函数
x => {
return "参数是："+x
};
相当于
x => ("参数是："+x);
相当于
function (x) {
return "参数是：" + x;
}
有返回值并且带多个参的箭头函数
(x,y) => ("返回值是："+x+y);
相当于
function (x, y) {
return "返回值是：" + x + y;
}
返回对象的箭头函数
() => ({
username: 'Tom'
});
相当于
function () {
return {
username: 'Tom'
};
}
返回对象并且带參的箭头函数
(x,y) => ({
username: x,
age: y
});
相当与
function (x, y) {
return {
username: x,
age: y
};
}
包含多条语句并且有返回值的箭头函数
这时不能用这种写法了:
() => (1);
只能用这种写法：
() => {
if (1 > 2) {
return 1
}else{
return 2
}
}
相当于
function () {
if (1 > 2) {
return 1;
} else {
return 2;
}
}
箭头函数和匿名函数的区别
箭头函数看上去是匿名函数的一种简写，但实际上，箭头函数和匿名函数有个明显的区别：箭头函数内部的this是词法作用域，由上下文确定。