Javascript variable capture

Question

I faced with strange behaviour when using eval in JS.

var f = function () {
    var x = 10;

    return function () {
        eval('console.log(x);');
        window['eval']('console.log(x);');
    }
};

f()();

OUTPUT:

10
undefined:1
console.log(x);
            ^
ReferenceError: x is not defined

Why using eval explicitly captures the x but global['eval'] doesn't? And even though global['eval'] doesn't capture x, why it's unable to see after eval, which already captured x?

the better question is why are you using eval? eval does magical things. it is best to leave it alone. — Dan
– Dan, Commented Sep 17, 2016 at 20:08
Sometimes for remote testing I need to quickly load and run my local code. Not for production code :) — Sergey Sahakyan
– Sergey Sahakyan, Commented Sep 17, 2016 at 20:11
@NehalJWani it's not related, question is about capturing when you use eval. Thanks. — Sergey Sahakyan
– Sergey Sahakyan, Commented Sep 17, 2016 at 20:15
"Sometimes for remote testing I need to quickly load and run my local code" - then I recommend you find a better way to do that. You have problems understanding what is going on now already, so it is likely that you come across such or similar behavior again when testing this way - so you will never be able to quickly determine whether a problem is with your actual code, or just with the way you are getting it to execute. I'd rather use debugging tools that make my life easier, not harder. — C3roe
– C3roe, Commented Sep 17, 2016 at 20:40

StvnBrkdll · Accepted Answer · 2016-09-17 20:22:42Z

7

window['eval'] operates at global scope, eval() operates at local scope.

From Mozilla's Javascript reference:

If you use the eval function indirectly, by invoking it via a reference other than eval, as of ECMAScript 5 it works at global scope rather than local scope; this means, for instance, that function declarations create global functions, and that the code being evaluated doesn't have access to local variables within the scope where it's being called.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval

answered Sep 17, 2016 at 20:22

StvnBrkdll

4,0601 gold badge29 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dan · Accepted Answer · 2016-09-17 20:23:41Z

3

Your inner function does not actually capture the reference of x, and so it is never directly passed to eval.

eval usually works at the local scope and so the first call succeeds (because the local scope contains the declaration of x).

However, if you invoke eval in such a way that you don't have a direct reference to it, it will invoke itself in the global scope, which var x is not a part of, and it fails.

Just don't use eval.

edited Sep 17, 2016 at 20:23

answered Sep 17, 2016 at 20:15

Dan

10.6k2 gold badges40 silver badges68 bronze badges

Comments

guest271314 · Accepted Answer · 2016-09-17 20:20:34Z

2

You can use Function.prototype.bind() to pass x to returned function

var f = function () {
    var x = 10;

    function y(n) {
        eval(`console.log(${n})`);
        window["eval"](`console.log(${n})`);
    }

    return y.bind(this, x)
};

f()();

answered Sep 17, 2016 at 20:20

guest271314

1

1 Comment

Dan Over a year ago

Well, this is string interpolation, you don't even need bind for this, you could just interpolate the variable directly in the eval statement without using a parameter. f = function() { var x = 5; return function () { eval(`console.log(${x})`) } }

Grzesie2k · Accepted Answer · 2016-09-17 20:23:25Z

1

window.eval work in global scope.

var variable = 1;

(function(){
  var variable = 100,
      cmd = "++variable";
  document.write(eval(cmd)+"\n"); // increment local var 100 and output 101
  document.write(window.eval(cmd)+"\n"); // increment global var 1 and output 2
})();

answered Sep 17, 2016 at 20:23

Grzesie2k

192 bronze badges

Collectives™ on Stack Overflow

Javascript variable capture

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related