Table of contents
In day-to-day life, we code a lot. 🤝 It is nice to meet you if you are a person who spends some time choosing a good name for the variable, just like me. We stay safe by alternating between "let" and "const" but "var" is helpful in handling certain use cases, and knowing it in depth will help us be more clear
"Var" and it's RULES
The default value of VAR is "undefined"
Var can be used as a global scope and function scope
NOTE : (global scope can be called anywhere. If a variable is declared outside a function then it can be called inside a function and used)
(function scope -> only with-in function. If a var is declared inside a function then it cannot be used outside it)
It can be re-assigned and re-declared
Var is Hoisted (i.e., Hoisting is a mechanism by which the variables(with VAR) and (function declaration) will move on top of the scope before the code executes)
NOTE: Only the function declaration is hoisted and not the function expression
Duplication of variables will not trigger an error even in "strict mode"
Variables will not lose their value unless we initialize a new value (i.e., var a=3; a=4; => now "a" is 4)
Creating the variable"var"
Variables can be created and used in 2 ways
Traditional way
Destructured way to declare a variable (99.9% we don't use such type of var declaration)
Variable declaration and initialization
variable declaration is defining a variable without any value
Eg : var x ;
variable initialization is assigning a value for the variable that we declared
Eg : var x = 5 ;
Visibility of variable
Variables declared with "var" and "unqualified variables" alone will get added as a property of the global object (i.e., the "window" object). LET and CONST will not get added
Undefined vs Not-defined (Reference Error)
Undefined: Calling a variable before it is initialized with a value
This happens in two scenarios:
If we just declared the variable and called it
If we call a variable before it is declared and initialized
Not-defined: if we try calling a variable that does not exist at all
Variables in action (Eg code)
How do I find if a variable is globally scoped?
type "window" in the Console
check by using ==> this.VARIABLE_NAME; (i.e., var x = 3 ; this.x)
Object.hasOwn(this, "VARIABLE_NAME") ==> this will result in TRUE if global (or) FALSE if it is not a global variable
SECRET of "var" over GLOBAL CONTEXT
If you are using "VAR" globally, it will be added as a non-configurable property of the global object. As a result, it cannot be deleted with the "delete" keyword
The "delete" operator can only delete properties in an object if they are "qualified" as "configurable" - which means configurable should be "true"
Example of "VAR"
Example of "LET"
Initializing many variables
Remember, even if we define many variables, their values will get assigned only after initialization
Thank you very much if you came this far. I assume this blog has provided in-depth knowledge of the "var" keyword. Please share if you find this interesting.