How JavaScript Really Executes Code: Execution Context and Scope Chain Explained

Note: This post is a translated version of an article originally published on my personal blog. You can read the original Korean post here . Heads up: This post is written based on the ES5 specification. In ES6+, some details changed — such as where ThisBinding lives, and the distinct roles of VariableEnvironment vs LexicalEnvironment . I'll cover the ES6 version in a follow-up post. Why Should You Care About Execution Context? If you've been writing JavaScript for a while, you've probably run into these puzzling moments: The same this keyword points to completely different objects depending on the situation A variable you never declared somehow doesn't throw an error You can freely access a variable that's defined outside your current scope Sure, you can get by without knowing why these things happen. But eventually you hit a wall: Your code "just works" but you can't explain why You can't control what this points to Variables get shared in unintended ways, spawning bugs everywhere Un