IconVault logoIconVault
Sign in

Scope Visualizer - Free Online JavaScript Scope Tool | IconVault

Visualize JavaScript scope chains, hoisting and var/let/const bindings in a live tree. Free, runs fully in your browser.

All tools

Scope Visualizer

See your JS scope tree, hoisting and bindings live

5 of 5 free uses left

Presets

Your code

Subset: function () {...} (nesting ok), var/let/const, console.log, calls, return, + - *. No parameters yet.

5 of 5 free runs left. Stepping through a trace is always free.

Step 1 of 17

Creation phase for global: var is hoisted as undefined, function declarations are hoisted whole, let/const are created but locked in the temporal dead zone.

Scope chain

globalactive

ƒ makeCounter: function makeCounter

struck = temporal dead zone (declared, not yet usable).

Source

 1function makeCounter() {
 2  let count = 0;
 3  function inc() {
 4    count = count + 1;
 5    return count;
 6  }
 7  return inc;
 8}
 9const c = makeCounter();
10console.log(c());
11console.log(c());

Console

Nothing logged yet

Simplified model: function-scoped only (no block scopes or parameters yet), but hoisting, the dead zone and lexical closures behave like the real language.

About this tool

IconVault's Scope Visualizer turns confusing JavaScript scope behavior into a clear, interactive tree. Paste your code and watch how the engine builds the global scope, nested function scopes and block scopes, and where every var, let, const and function declaration is bound, so you can see exactly which variable a name resolves to at each line.

It is built for learning and debugging: follow hoisting of var and function declarations, spot shadowing bugs where an inner binding hides an outer one, and trace closures back to the scope they capture. Everything is parsed and rendered fully in your browser with nothing uploaded, and it is free to try (heavy repeated use may ask for Pro).

Frequently asked questions

Popular searches

javascript scope visualizerjs scope visualizerjavascript scope chainvisualize javascript scopejs scope chain explainedjavascript lexical scopescope chain visualizerjavascript hoisting visualizervisualize js hoistingvar let const scopejavascript var let const differencejavascript scope tutorialjs scope tutorial for beginnersunderstand javascript scopejavascript closure visualizervisualize js closuresjavascript shadowing examplevariable shadowing javascriptjavascript temporal dead zonetdz javascript explainedfunction scope vs block scopejavascript block scope explainedglobal scope javascriptjavascript scope treejs scope tree diagramjavascript binding visualizationjavascript engine scopelexical scoping javascript examplejavascript scope interview questionsscope chain lookup javascriptjavascript variable resolutionhoisted var vs letfunction declaration hoistingjavascript scope debuggingdebug js scope issuesjs scope practicelearn javascript scopejavascript scope playgroundscope visualizer online freejavascript scope tooljs code visualizerjavascript execution context visualizerexecution context vs scopejavascript scope examplesnested function scope javascriptblock scope let const examplejavascript scope chain interviewhow does javascript scope workjavascript scope explained visuallyjs scope chain diagram generatorvisualize scope in javascript onlinejavascript let const block scope demo

More tools

Code Playground

Write HTML, CSS & JS with live preview.

JSON Formatter

Beautify, validate & minify JSON.

Base64 Encoder

Encode & decode text and files.

JWT Decoder

Inspect tokens without sending them anywhere.

Coming soon

CLI

Coming soon

Figma plugin

Coming soon

VS Code extension

Coming soon

Chrome extension

Coming soon

AI icon generator

Coming soon

Team workspaces

Coming soon

View all 10+ tools →