02函数-04-箭头函数（ES6）

ES6新增的函数：Arrow Function，定义方式就是一个箭头

箭头函数相当于匿名函数，并且简化了函数定义，和匿名函数最大的区别在于其内部的this不再“乱跑”，而是由上下文确定

• 定义仅包含一个表达式时，可以省略花括号和return
• 定义包含多条语句时，则不能省略花括号和return
• 参数不止一个时，需要用括号括起来

x => x * x 

//相当于
function (x) {
    return x * x;
}

6

 

1

x => x * x 

2

3

//相当于

4

function (x) {

5

    return x * x;

6

}

x => {
    if (x > 0) {
        return x * x;
    }
    else {
        return - x * x;
    }
}

8

 

1

x => {

2

    if (x > 0) {

3

        return x * x;

4

    }

5

    else {

6

        return - x * x;

7

    }

8

}

// 两个参数:
(x, y) => x * x + y * y

// 无参数:
() => 3.14

// 可变参数:
(x, y, ...rest) => {
    var i, sum = x + y;
    for (i=0; i<rest.length; i++) {
        sum += rest[i];
    }
    return sum;
}

14

 

1

// 两个参数:

2

(x, y) => x * x + y * y

3

4

// 无参数:

5

() => 3.14

6

7

// 可变参数:

8

(x, y, ...rest) => {

9

    var i, sum = x + y;

10

    for (i=0; i<rest.length; i++) {

11

        sum += rest[i];

12

    }

13

    return sum;

14

}

注意：如果要返回一个对象，如果是但表达式，需要增加括号，因为对象的函数体和语法有冲突：

// SyntaxError:
x => { foo: x }

// ok:
x => ({ foo: x })

x

 

1

// SyntaxError:

2

x => { foo: x }

3

4

// ok:

5

x => ({ foo: x })

其他备注参考链接

• 少年，不要滥用箭头函数啊