es6箭头函数

es6中新增的定义函数的方式：

() => {}
const fn = () => {}

函数体中只有一句代码，且代码的执行结果就是返回值，就可以省略大括号与return。

function fn(num1, num2) {
            return num1 + num2
        }
//它就等效于底下的代码
        const fn = (num1, num2) => num1 + num2

如果形参只有一个，就可以省略小括号。

const fn = a => {
            alert(a)
        }
        fn(20)

箭头函数中的this：

箭头函数不绑定this关键字，箭头函数中的this，指向的是函数定义位置上下文的this。

 const obj = {name: '张三'}
        function fn() {
            console.log(this);
            return fun = () => {
                console.log(this);
            }
        }
        const resfn = fn.call(obj)
        resfn()

打印如下：

 

一道关于箭头函数的面试题：

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

运行结果是弹出一个undefined。在这里this指向的是该函数(方法)的上下文中的this，因为对象内没有作用域，所以say方法内的this就指向window。而window中不存在age这个属性，所以显示undefined。

如果我们在外部声明一个age=20，再来看结果是多少。