箭头函数的使用

ECMAScript6新增了使用胖箭头(=>)语法定义函数表达式的能里。很大程度上，箭头函数实例化的函数对象与正式的函数表达式创建的函数对象行为是相同的任何可以使用函数表达式的地方，都可以使用箭头函数。

语法如下

let fun = 形参 => 函数体
  调用fun(实参)

代码演示以及注意点

   let fun = (a, b) => a * b;
        console.log(fun(2, 2)) //4

        let fun1 = (a, b) => {
            console.log("多条语句的时候不能省略{}");
            return a * b
        }
        console.log(fun1(3, 3)); //9

        let fun2 = (a, b) => a * b //多个参数传入的时候需要加上() 如果只有一个参数可加可不加
        console.log(fun2(1, 2));
        // 注意点
       			 (1)当只有一条语句或者表达式的时候{}可省略,当省略{}的使用会自动 return 返回当前语句或者表达式的执行结构
       	 		 (2) 如果多条语句的时候不能省略{}
       			 (3)多个参数的时候需要加上()号,不然会报错

箭头函数的特点

• 箭头函数没有自己的this，不是在调用的时候决定的，而是定义的时候决定的
• 定义的时候看外部是否有函数，如果有那么当前箭头函数的this同外部函数的this指向是同一个对象，如果外部没有函数this指向的是window
• 箭头函数不能用作构造函数。因为箭头函数在定义的时候就决定了this的指向了，箭头函数也没有prototype属性也不能使用arguments。

代码演示

  var btn = document.querySelector('button');
        var obj = {
            uname: 'hh',
            age: 12,
            test: () => {
                btn.onclick = () => {
                    console.log(this); //这里的this指向的是window因为外面套的也是箭头函数，箭头函数this指向window
                }
            }
        }
        obj.test()

        var btn = document.querySelector('button');
        var obj = {
            uname: 'hh',
            age: 12,
            test: function() {
                btn.onclick = () => {
                    console.log(this); //这里的this指向的是obj对象，因为上面的函数this指向得是obj对象
                }
            }
        }
        obj.test()