JSFiddle - React, Tailwind, and code Playground

JavaScript

console.clear();

// So having an object like Foo
function Foo() {
    this.dirThis = function () {
        console.dir(this);
    };
};

// Instantiating a new Foo
var foo = new Foo();

// Foo.dirThis() has it's original context
foo.dirThis(); // First log in console (Foo)

// The calling code is in Window context
console.dir(this); // Second log in console (Window)

// Passing a reference to the target function from another context
// changes the target function's context
var anotherFoo = foo.dirThis;

// So, when being called through anotherFoo, 
// Window object gets logged
// instead of Foo's original context
anotherFoo(); // 3rd log


// So, to elaborate, if I create a type AnotherFoo
function AnotherFoo(dirThis){
    this.dirThis = dirThis;
}

// And and instantiate it
var newFoo = new AnotherFoo(foo.dirThis);

newFoo.dirThis(); // Should dir AnotherFoo (4th in log)