Does a JavaScript-function can be seen as an execution context respectively as this?

Question

In the lower example, why does the function outer which is assigned as method to the object-property with the identifier meth does not have an execution context which would be the this in the inner-function?

Since the function outer assigned to meth seems to automatically get the this-keyword set to the surrounding object as execution context, you could assume, that the function inner is getting handled the same way, or is it because a surrounding function can not be seen as an execution context, therefore JavaScript does not know for the function inner which execution context it is in, so it assumes the default, which is then window?

var foo = {
    meth: function outer() {
        console.log(this);
        // let that = this;
        function inner() {
            console.log(this);
        }
        inner();
    }
};

//Output
{meth: ƒ}
Window {parent: Window, opener: null, top: Window, length: 0, frames: Window, …}

Thanks in advance for demystifying

"you could assume, that the function inner is getting handled the same way" — Why could you assume that? It is a different function that is called differently. — Quentin, May 28 '20 at 16:20
"*Since `outer` seems to automatically get the this-keyword set to the surrounding object as execution context*" - no, it doesn't automatically get that. Also in your code you haven't even shown how you are calling it. — Bergi, May 28 '20 at 16:21
The `inner` function is not called from an object. `this` refers to the object a function is called on. e.g. this [gist](https://gist.github.com/C5H8NNaO4/24fa7ee87b8f099f6de3811f97c8d44c). The behaviour is defined in the specs under [Entering Function Code - 10.4.3.2](http://es5.github.io/#x10.4.3) and [Function Calls - 11.2.3](http://es5.github.io/#x11.2.3) — Moritz Roessler, May 28 '20 at 16:29

trincot · Accepted Answer · 2020-05-28T16:22:34.490

When you see this code:

function inner() {
    console.log(this);
}
inner();

It really is irrelevant whether that code occurs in another function body or not, or whether that function body belongs to a method of some object, ...etc. It is irrelevant.

What is relevant is how you call inner. You call it not as someobject.inner(), nor with explicit binding, like inner.call(this), ... so there is no binding of this, hence you get the default binding, which is the window object when running in sloppy mode, or undefined in strict mode.

The function outer assigned to meth seems to automatically get the this-keyword set to the surrounding object as execution context

This is not assured. If you do:

let outer = meth.outer;
outer();

...then you will notice that this is getting the default binding as well. Again, it depends on how you call the function.

If you call it with the dot-notation, then you implicitly bind it with the object:

meth.outer();

So now this will be meth in the execution context of outer.

(except whether it occurs in a strict mode code or not) – Bergi May 28 '20 at 16:22 — Bergi, May 28 '20 at 16:22

Does a JavaScript-function can be seen as an execution context respectively as this?

1 Answers1