18

Some variables can be "optimized out" during Javascript execution. Thus values of such variables are not available for inspection while debugging (User documentation). Variables view shows (optimized away) message and console throws following error if the variable is tried to be evaluated:

Error: variable has been optimized out

Is there any way to enforce evaluation of such variable or disable this optimization in Firefox?

czerny
  • 15,090
  • 14
  • 68
  • 96

3 Answers3

10

Use the variable in a way that prevents this optimisation.

function NOP() {}

// then in the optimised code

    NOP(myvar);
    // debugging here should now show `myvar`
Paul S.
  • 64,864
  • 9
  • 122
  • 138
  • This shows out to prevent optimization with code, but not how to get the value when it's been optimized. Can you force the browser (here I believe the question is specifically Firefox even though it doesn't say it) from optimizing? (More possibly [here](https://stackoverflow.com/questions/58861823/can-i-turn-off-optimization-so-in-scope-variables-from-closures-arent-optimiz)). – ruffin Nov 06 '20 at 14:27
5

When a variable has been "optimized away," it just means that it's not being modified in the context of the current scope. Hence, the JavaScript engine has done some optimization magic and stashed that variable out of the way for the time being. For example, say you're using lodash to iterate over a collection of some kind.

var parentThingy = [];
var childThingy = [];
_.each (collectionThingy, function(data){

    // parentThingy is not being modified inside this callback
    // so it will be "optimized away" while you are inside this
    // function scope.

    var transformed;
    if (data.someFlag) {
        transformed = transformDataSomehow(data);
    }

    // childThingy is being modified, so you will be able to
    // see its value in the debugger.

    if (transformed) {
        childThingy.push(transformed);
    }
});

// Now that you've exited the callback scope, you will be able to see
// the value of parentThingy again.

if (childThingy.length > 1){
   parentThingy.push(childThingy);
}

You could use the NOP suggestion to force parentThingy to be visible in the callback scope, but since you're not modifying parentThingy inside that callback, you don't need to see it. It hasn't changed and won't change. It's not relevant to the code you're currently debugging. Once you've exited the callback's scope parentThingy will be visible to the debugger again.

FYI: this isn't a Firefox thing. Chrome does the same thing, it just uses different verbiage to indicate the variable is irrelevant to the current scope.

SeanH
  • 317
  • 5
  • 9
  • 13
    I would strongly disagree with the statement "you don't need to see it". If you're developing code, and you're experimentally poking around different values to try to debug something, it is totally possible that you need to see it. To have no option to see it, except via a hacky NOP() trick is ... frustrating – Stewart Feb 01 '18 at 13:14
1

If you need to debug this variable, then you have to set the breakpoint at a place inside the function where this variable is declared.

Lets say you need to debugg the variable

"value"

function(value) {
   // If you set the breakpoint somewhere here it is OK

   myArray.map(function() {

       // If you set the breakpoint here you will get an Error: variable has been optimized out

   }

} 
Elio
  • 428
  • 3
  • 20