javascript - Retrieving values from Execution Contexts in JavaScript

Question

var value = 10;

var outer_funct = function(){
    var value = 20;

    var inner_funct = function(){
        var value = 30;

        console.log(value); // logs 30
        console.log(window["outer_funct"]["value"]); // What I would like to log here is the value 20.
        console.log(window["value"]); // logs 10
    };

    inner_funct();
};

outer_funct();

I believe the reason the second log is returning undefined is because window["outer_funct"] refers to the function object, and the function object doesn't have a property "value" associated with it. Instead, what I would like to do is refer to the execution context when window["outer_funct"] is invoked. Is this possible to do within the execution context of inner_funct?

Answer 1

I believe the reason the second log is returning undefined is because window["outer_funct"] refers to the function object, and the function object doesn't have a property "value" associated with it.

Correct.

Instead, what I would like to do is refer to the execution context when window["outer_funct"] is invoked. Is this possible to do within the execution context of inner_funct?

No, not with you having shadowed value (declared it in inner_funct). You have no way of getting to it with that symbol having been overridden like that. You could, of course, grab it into another symbol:

var value = 10;

var outer_funct = function(){
    var value = 20;

    var outer_value = value;

    var inner_funct = function(){
        var value = 30;

        console.log(value);        // logs 30
        console.log(outer_value);  // logs 20
        console.log(window.value); // logs 10
    };

    inner_funct();
};

outer_funct();

如果你没有隐藏它，那么你可以value在包含的上下文中引用它，例如：

var value1 = 10;

var outer_funct = function(){
    var value2 = 20;

    var inner_funct = function(){
        var value3 = 30;

        console.log(value3); // logs 30
        console.log(value2); // logs 20
        console.log(value1); // logs 10
    };

    inner_funct();
};

outer_funct();

值得注意的是，window["value"]返回原始代码的唯一原因10（顺便说一句，您也可以使用window.value）是var value = 10;在全局范围内。声明的所有变量都var成为全局对象的属性，在浏览器上通过引用它window（从技术上讲，window它本身只是全局对象上指向全局对象的属性）。

Answer 2

由于您提到的原因，您不能完全引用value使用。window["outer_funct"]你可以做的是这样的：

var value = 10;

var outer_funct = function(){
    var context = {// you can put multiple values in here
        value: 20;
    }

    var inner_funct = function(){
        var value = 30;

        console.log(value); // logs 30
        console.log(context.value); //logs 20
        console.log(window["value"]); // logs 10
    };

    inner_funct();
};

outer_funct();

Another way you can do it is if you haven't shadowed value inside inner_funct. If you don't have a variable named the same thing, you can log it and it will return 20. But since you created another variable named value inside inner_funct, that will shadow the value of value in outer_funct.

I would also question why you would need to have three variables named exactly the same, across three scopes.

Answer 3

var value = 30; is a local variable in function outer_funct, it could not be accessed from outside of this function.

in your code, although winodw["outer_funct"]["value"] is written inside inner_funct but it acts as trying to access a local variable from out of outer_funct because by `window['outer_funct'] you are staying at the top level.

Answer 4

No, it is absolutely impossible to access non-global shadowed variables in JavaScript.

You cannot get the execution context of a function as well, it is an implementation-dependent internal value (specification type) - you are correct, your code was looking for properties on the function object.

Variables in the global scope could be accessed as properties of the global object (window in browser), but if you are shadowing a local variable your only choice is to rename your own variable that casts the shadow.

Answer 5

Local variables are intended to be non-accessible, also because they can depend on the function execution (how could you access that variable if the function has never been executed?).

If you really need some trick, you can have a look at this:

var person = function () {
    // Private
    var name = "Robert";
    return {
        getName : function () {
            return name;
        },
        setName : function (newName) {
            name = newName;
        }
    };
}();
alert(person.name); // Undefined
alert(person.getName()); // "Robert"
person.setName("Robert Nyman");
alert(person.getName()); // "Robert Nyman"

and notice that the function must be executed before you can use accessible methods.

Answer 6

Variables don't become properties of the functions under which you define them. Excluding the window object (in the case where they are globally declared) there's no object off of which you can access a locally-defined variable. There are workarounds as suggested by the other answers, but they are still a testament to JavaScript's inability to perform such a task in the actual circumstance that you've shown us.