Why does JavaScript hoist variables?
What was the rationale of the designers when they decided to implement hoisting? Are there any other popular languages that do this?
Please provide relevant links to documentation and/or records.
3 Answers
As Stoyan Stefanov explains in "JavaScript Patterns" book, the hoisting is result of JavaScript interpreter implementation.
The JS code interpretation performed in two passes. During the first pass, the interpreter processes variable and function declarations.
The second pass is the actual code execution step. The interpreter processes function expressions and undeclared variables.
Thus, we can use the "hoisting" concept to describe such behavior.
7 Comments
contactmatt
I personally really do not like the word "hoisting". It gives the false representation that variable and function declarations are magically hoisted to the top of the current scope, when in reality, the JS interpreter, as you mentioned, scans the source code for the bindings and then executes the code.
Bergi
Uh, this doesn't really explain the rationale. A single-pass interpreter (that would not have led to hoisting) would have been much simpler - so why did the designers opt for two passes?
Josh M.
This does not explain why variables, specifically are hoisted. Functions make sense, variables do not (in most cases) -- I believe it's a bug.
Jonas Wilms
Josh M. This is so extensively specified, I don't think that this is a "bug" ... (I agree that this answer doesnt really answer the reasoning though)
Jswq
This answer doesn't really explain why the designer decides to implement hoisting, just explain what causes hoisting. so I would also give a -1. And as the other answer mentioned by @gfullam, the result of "hoisting" could be unintended.
|
JS creator Brendan Eich once said on 
…
function hoisting allows top-down program decomposition, 'let rec' for free, call before declare; var hoisting tagged along.
He proceeded with the explanation that…
var hoisting was thus [an] unintended consequence of function hoisting, no block scope, [and] JS as a 1995 rush job.
Are there any other popular languages that do this?
I don't know of any other popular languages that hoist variables in the same manner. I think even ActionScript — another implementation of ECMAScript used in Flash development — did not implement hoisting. This has been a source of confusion and frustration for developers familiar with other languages who are learning JavaScript.
5 Comments
Damon
Giving a +1 as this is the only answer that attempts to directly address the question.
codingbryan
Thank you for this answer. I fully agree with @Damon!
Géry Ogam
Another popular language which has variable hoisting is Python: stackoverflow.com/q/63337235/2326961
Victor Yan
Incorrect. Python does NOT have variable hoisting. See: discuss.python.org/t/…
Gruber
Interesting also the followup of that tweet, which explains what "let rec" is twitter.com/BrendanEich/status/1290676504502788096, pointing to stackoverflow.com/questions/16530534/…
This is because javascript interpreter interprets code in two cycles.
- Code completion/compilation:
- Code execution:
In 1st cycle all the variable and function declarations are taken to top of the function scope it is executing in. This helps in creating variableObjects for execution context of function even before it's execution.
In 2nd phase, value assignments, code statements and function calls takes place line by line in expected manner.
You have a little more detailed read over here.
It will give you a better picture around behavior around let, const and class declarations, also the precedence it follows between variable and functions.
1 Comment
Bombinosh
Are you implying that it's a consequence of a design choice? If so, you should state it clearly in your answer. But reading Brendan Eich's answer, it might have been a wanted feature, it depend of how you interpret the last sentence. Bottom line, i still don't know why for sure
divin jQuery