函数-----普通函数，箭头函数，回调函数的this分析

今天来总结一下this在不同情况下的this的指向问题：

var name = 'window';
var bar = { name: 'bar' };

var foo = {
    name: 'foo',
    say: function () {
        console.log(this.name);
    },
    say2: () => {
        console.log(this.name);
    },
    say3: function () {
        return function () {
            console.log(this.name);
        };
    },
    say4: function () {
        return () => {
            console.log(this.name);
        };
    }
};

普通函数

测试1：

foo.say();
foo.say.call(bar);

foo
bar

• "."号使用函数的时候this指向调用函数的对象，即点号之前的内容，故输出foo。
• 普通调用可以用call来改变函数this，故bar。

箭头函数

测试2：

foo.say2();
foo.say2.call(bar);

window（js执行环境）/undefined（node执行环境）   //以下未说明的皆是两种输出
window

• 箭头函数的this取决于其创建时所在的执行环境的this，该箭头函数在全局创建，所以指向全局，输出window。
• 箭头函数的this不会改变，所以call无法改变其this指向，所以还输出window。

回调函数

测试3：

foo.say3()();
foo.say3().call(bar);
foo.say3.call(bar)();

window
bar
window

• 回调函数是全局创建的，不是say3创建的，因此它的this指向全局，而与产生它的say3方法无关。
• call可以改变回调函数的this。
• 改变的是say3的this，回调函数的this没有受到影响。

箭头函数作为回调函数

测试4：

foo.say4()();
foo.say4().call(foo);
foo.say4.call(bar)();

foo
foo
bar

• foo.say4()的this是foo，foo.say()()是箭头函数，所以与执行环境foo.say4()的this一样，也是foo。
• call的使用对象是箭头函数foo.say()()，所以无效，还是foo。
• call的使用对象是箭头函数foo.say4()，有效，所以输出bar。

其中箭头函数的this详见，https://blog.csdn.net/qq_43198793/article/details/109355661
以上就是this指向的详细总结，欢迎指正。