ES6箭头函数

ES6箭头函数

1. 格式
   原来的函数写法

function fn(a,b){
	return a+b;
}

箭头函数写法

let fn=(a,b)=>{
	return a+b;
}
let result=fn(1,2);
console.log(3);

2. 注意点

• this是静态的，始终指向函数声明时所在作用域下的this的值，即使使用call，apply等方法改变作用域，也不会改变this的指向
  例如：

		window.name = 'jisoo';
        let obj = {
            name: 'lisa';
        };
        function name1() {
            console.log(this.name);
        }
        let name2 = () => {
            console.log(this.name);
        }
        name1(); //普通函数里的this指向全局变量jisoo
        name2(); //箭头函数里的变量在全局作用域下声明jisoo
        //call()方法调用
        name1.call(obj); //lisa(call方法有效)
        name2.call(obj); //jisoo(call方法无效)

• 不能作为构造函数实例化对象
  例如：

		function obj1(name, age) {
            this.name = name;
            this.age = age;
        }
        var bp = new obj1('jisoo', 25);
        console.log(bp.name);//‘jisoo’
        console.log(bp.age);25          原来的函数写法

	var obj2 = (name, age) => {
        this.name = name;
        this.age = age;
    }
    var bp1 = new obj2('jennie', 24);
    console.log(bp1.name);
    console.log(bp2.age);//会报错(obj2 is not a constructor)

• 不能使用arguments变量
  例如：

		function blackpink() {
            console.log(arguments.length);
        }
        blackpink(1, 2);//2
        let bp=()=>{
        	console.log(arguments.length);
        }
        bp(1,2);//报错arguments is not defined

• 箭头函数的简写

  省略小括号(当形参有且只有一个时)

		var rose = n => {
            console.log(n + n);
        }
        rose(8);//16
        var rose1 = (n) => {
            console.log(n + n);
        }
        rose1(9);//18

省略花括号和return(当代码体只有一条语句时)

		var rose2 = n => {
            console.log(n * n);
        }
        rose2(8);//64
        var rose3 = m => console.log(m * m);
        rose3(9);//81

• 箭头函数最适合把一个函数作为参数传到另一个函数中使用和与this无关的回调，例如计数器，数组的方法等