语法不同

1正常语法:

  1. 正常语法
  2. const sum = (x, y) => {
  3. return x + y;
  4. };

2.如果函数体中只有一句话,而是return啥啥,则可以省略大括号和return

const sum = (x, y) => x + y;

3.如果只有一个形参,可以省略小括号

const sum = x => x + 10

以下例子更改为箭头函数

function fn(x) {
    return function (y) {
        return x + y;
    }
}
//更改为箭头函数
const fn = x => y => x + y;
console.log(fn(10)(20));

1)箭头函数没有arguments 普通函数有

箭头函数中没有arguments,但是可以使用ES6中的剩余运算符[…]来获取实参集合

const fn = (...params) => {
    // console.log(arguments); //Uncaught ReferenceError: arguments is not defined
    // console.log(params); //[10,20,30]
    // @1 arguments如果存在,获取的集合也是类数组集合,不能直接使用数组的方法
    // @2 params获取的是数组集合,可以直接使用数组的方法的
};
fn(10, 20, 30);

ES6剩余运算符获取的是数组集合,可以使用数组的方法

2)箭头函数中没有自己的THIS,函数中出现的THIS是其上级上下文中的THIS

ES6的新语法规范

普通函数

let obj = {
    name: 'zhufeng',
    // 等价于“fn: function () {}”,ES6的新语法规范
    fn() {
        // this->obj
        let self = this;//然后存起来
        setTimeout(function () {
            // this->window  对于普通回调函数“匿名函数”来说,一般方法中的this都是window,除非在触发回调函数执行的时候,我们自己(或者浏览器)做过一些特殊的处理,更改过其this...
            //console.log(this.name);//this=>window
            //想要obj的那么
            console.log(self.name);//'zhufeng'

        }, 1000);
    }
};
obj.fn();

箭头函数

let obj = {
    name: 'zhufeng',
    fn() {
        // this->obj
        setTimeout(() => {
            // this->没有,用的是上级上下文中的
            console.log(this.name);//obj.name
        }, 1000);
    }
};
obj.fn();

好用但是不要乱用

let obj = {
    name: 'zhufeng',
    fn: () => {
        // this->没有,用的是全局上下文中的this:“window”
        console.log(this);
    }
};
obj.fn();//此时this就不是Obj 因为用了箭头函数

3)箭头函数没有prototype属性,所以不能被new执行