关于#javascript#的this指向问题:上面段代码会输出calc1这个对象但为什么下面这段代码是输出window对象呢

关于#javascript#的this指向问题:上面段代码会输出calc1这个对象但为什么下面这段代码是输出window对象呢

问题描述:

const calc1 = {
            add: function() {
                const adder = () => {
                    console.log(this);
                };
                adder();
            }
        }
        calc1.add();

上面段代码会输出calc1这个对象
但为什么下面这段代码是输出window对象呢?

const calc1 = {
            add: function() {
                const adder = function (){
                    console.log(this);
                };
                adder();
            }
        }
        calc1.add();

请解析一下思路!

这种情况找官方文档是最标准的this-MDN
js的this是个挺复杂的东西,和严格模式、js运行的平台、函数调用、箭头函数都有关,文档已经说的很详细。
简单来说在函数内部,this的值取决于函数被调用的方式。因为下面的代码不在严格模式下,且 this 的值不是由该调用设置的(adder是直接被调用的),所以 this 的值默认指向全局对象,浏览器中就是 window。
而箭头函数例外,在箭头函数中,this与封闭词法环境的this保持一致。即与外层add函数的this保持一致,所以是calc1对象