ES6 箭头函数

箭头函数：用来简化函数的定义语法；

格式：

        () => {

            // 函数体
        }

（）： 小括号中  依然是放置形参的地方

｛｝： 大括号中 依然还是函数体

通常情况下 我们都会将 箭头函数 赋值给一个变量，变量名字就是函数名字，通过变量名字 调用函数

        const fn = () => {
            alert('这是箭头函数');
        }
        fn()

箭头函数的简写：

1. 当形参只有一个的时候  可以把 （） 省略掉； 

//普通函数的写法 
    let aqe = function(a){
        return a*a
    }
    console.log(aqe(6)) //36
//箭头函数写法
    let qer = a => {
        return a *a
    }
    console.log(qer(8))  //64

2. 当代码体只有一条语句的时候 ，可以省略 {} ，此时return 必须省略，而且语句的执行结果就是函数的返回值

单个参数

// 普通函数写法  
    let fun = function(n){
        return n * n
    }
    console.log(fun(9)) //81
//箭头函数一句代码
    let fun = n => n*n
    console.log(fun(7)) // 49

多个参数 

        // 计算任意两个数的和 （普通的函数写法）
        function sum(num1,num2){
            return num1 + num2
        }
        console.log(sum(1,3))

通过箭头函数可以这样写：

        const sum = (num1,num2) => num1 + num2;  //箭头函数写法
        const result = sum(1,4);
        console.log(result);  // 5

 

箭头函数改变this指向：

        在传统函数中，是谁将函数调用起来，函数内部的 this 关键字 就指向谁，但是在箭头函数中就不拥有这个特性，因为箭头函数不绑定this，箭头函数没有自己的this，如果在箭头函数使用this关键字，他将指向箭头函数定义位置中this，也就是说箭头函数定义在那，this指向就指向哪。

        箭头函数不绑定this,箭头函数没有自己的this关键字，如果在箭头函数中使用this，this关键字将指向箭头函数定义位置中的this

        var obj = {
            age : 20,
            say:() => {
                alert(this.age);  // undefined
            }
        }
        obj.say();

为什么是 undefined ？  箭头函数没有自己的this，箭头函数中的this 指向定义区域中的this，obj 是一个对象，不是函数 不能产生作用域，所以这个箭头函数实际是被定义在全局的作用域下，所以我们在调用say() 方法时，this 指向的是window，window下面没有age属性，所以弹出来的值是 undefined，

我们这个时候在全局作用域下定义一个age，我们可以来看看结果：

        var age = 10;
        var obj = {
            age : 20,
            say:() => {
                alert(this.age);  // 10
            }
        }
        obj.say();