03-箭头函数

一、介绍箭头函数

    <script>
        const fn = () => {
            console.log('123');
        }
        fn(); //调用箭头函数

        //函数体中只有一句代码,且执行的代码结果就是返回值,可以省略大括号
        // function sum(num1, num2) {
        //     return num1 + num2;
        // }
        const sum = (num1, num2) => num1 + num2;
        console.log(sum(1, 2));

        //箭头函数中 如果形参只有一个 形参外侧的小括号也是可以省略的
        const fs = n => alert(n)
        fs(5)

        //相当于
        // const fs = (n) => {
        //     alert(n);
        // }
    </script>

二、this指向

    <script>
        //箭头函数不绑定this关键字 箭头函数中的this 指向的是函数定义位置的上下文this
        //如果在箭头函数中使用this this关键字将指向箭头函数定义位置中的this
        const obj = {
            name: '张三'
        }

        function fn() {
            console.log(this);
            return () => {
                console.log('()=>');
                console.log(this);
            }
        }
        fn()
        const resFn = fn.call(obj);
        resFn();
    </script>

三、面试题

    <script>
        var age = 210

        var obj = {
            age: 20,
            say: () => {
                console.log(this); //this指向window
                alert(this.age);
            }
        }

        obj.say(); //210
    </script>