This question already has answers here:
Why does shadowed variable evaluate to undefined when defined in outside scope?
(6 answers)
Closed 3 years ago.
Why is the x variable in the example below returning undefined rather than 25?
var x = 25;
(function() {
console.log(x);
var x = 10;
})();
This is common problem of hoisting in javascript.The code actually looks like this.The value is assigned after the console.log.
The second undefined(if run on developer's tool) is because the function is not explicitly returning anything
This is how Javascript actually executes your code due to var hoisting:
var x = 25;
(function() {
var x;
console.log(x);
x = 10;
})();
It's Self-Invoking Functions that will invoke without calling from specific function or place. and your declared x inside that function and preparing for running that function make javascript ignore global variable x and try to create local x.if you remove var x = 10; from the function inside then everything will be OK:
var x = 25;
(function() {
console.log(x);
})();
Related
This question already has answers here:
Javascript function scoping and hoisting
(18 answers)
Closed 1 year ago.
I am learning javascript global variable and local variable. When I did experiment with it (see jsfiddle below) then I am confuse that why after executing myFunction1() the value of variable a became 4 instead of 5. What do you think happened inside the javascript memory which made its value 4 instead of 5 ?
var a = 4;
myFunction1();
function myFunction1() {
a= 5;
var a= 6;
}
alert(a); //a = 4
myFunction2();
function myFunction2() {
a= 5;
}
alert(a); //a = 5
You've just discovered hoisting.
By declaring var a inside the function, it is available to the whole function context (even before its declaration), so when you write a = 5 the actual a is not the one you expect, it's the function-scoped a.
In the second case, a is the one you expect (outside the function)
This question already has answers here:
JavaScript loop variable scope
(5 answers)
How do JavaScript closures work?
(86 answers)
Closed 3 years ago.
My code was compiled to the following, and it works, but I do not know why. The variable that references the incrementing value is not included as an argument in the for loop.
var _loop2 = function _loop2() {
var p = document.createElement('p');
p.setAttribute('class', 'location__result');
p.setAttribute('data-id', response.features[i].id);
p.setAttribute('data-center', response.features[i].center);
p.textContent = response.features[i].place_name;
p.addEventListener('click', function () {
endingInput.value = p.textContent;
endingResults.style.display = "none";
placeIconAndZoom(p, position);
});
endingResults.appendChild(p);
};
for (var i = 0, length = response.features.length; i < length; i++) {
_loop2();
}
A function (x) declared inside another function (y) has access to all variables in the scope of the x (unless they are masked by another variable of the same name).
y can also be the global or module scope rather than a function per se.
var i = "example";
function x() {
console.log(i);
}
x();
This is the classic case of why const and let were introduced in ES6
var has a function level scope. This differs to const and let in terms of scoping, where the variable defined in var can be accessible anywhere in hits function declaration.
In your case, we declare var i inside the for loop (the function level scope), and your for loop is calling your _loop2 function. Since _loop2 is part of the for loops function scope, you're able to access that variable.
This SO answer can explain it a million times better than I can:
What's the difference between using "let" and "var"?
You can fix this by either adding: use 'strict' ontop of your script file, but a much better way is to avoid using var all together (unless there is a special circumstance) and switch it to let
This question already has answers here:
What is the (function() { } )() construct in JavaScript?
(28 answers)
Closed 3 years ago.
I recently came across this javascript code in a competitive site and couldn't understand how this pretty much works.
var a= 1;
(function(){
console.log(a);
var a = 2;
console.log(a);
})();
I expected the output to be..
1 2
But to my surprise, the original output was..
undefined
2
Can someone please explain how it works? Thanks in advance.
The declaration of variable a is brought to the top of the scope. This process is called hoisting.
var a= 1;
(function(){
var a;
console.log(a);
a = 2;
console.log(a);
})();
Consider a general snippet without a IIFE and global variable.
function func(){
console.log(x)
var x = 2;
console.log(x)
}
func()
The declaration of x is hoisted to the top of the scope of the function.So the above code is same as
function func(){
var x; //x is declared and its value is undefined
console.log(x)
x = 2;
console.log(x)
}
func()
This question already has answers here:
What is the scope of variables in JavaScript?
(27 answers)
Closed 7 years ago.
In the code below
var x = 1;
(function () {
console.log(x);
var x = 2;
}());
Why is it that when console.log(x), x is undefined?
Variable hoisting. The actual code is executed like this.
var x = 1;
(function() {
var x; // x = undefined
console.log(x);
x = 2;
})();
Edit: On Mr Lister's advice, a bit on variable hoisting. From MDN (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var):
"Variable declarations, wherever they occur, are processed before any code is executed. The scope of a variable declared with var is its current execution context, which is either the enclosing function or, for variables declared outside any function, global."
Because of the compiler, even if you initiate a var down below the code, the compiler send it to the top, just like var x;, so it first initiate as undefined "x" before running console.log, that's why is such a good practice to initate all vars you're going to use first thing in the function, so these mistakes won't happen.
This question already has answers here:
How does the "this" keyword work, and when should it be used?
(22 answers)
What is the scope of variables in JavaScript?
(27 answers)
Closed 5 years ago.
I tried to search it on internet but didn't got any answer. Why access of two variables before declaration have two different outputs:
function test() {
console.log(a); // prints 'undefined'.
console.log(b); // prints 'b is not defined'.
var a = 5;
this.b = 10;
}
when you declare var variable inside the function then that variable is limited to that function. That mean scope of that variable is limited to that function so you can't access that variable outside of that function.
But if you use this then it can be access through outside but then again you need to create a object of that class/function and access trough it.
function test() {
var a = 5;
this.b = 10;
this.printB = function(){
return this.b;
}
this.printA = function(){
return a;
}
}
var obj = new test();
console.log(obj.a)
console.log(obj.b)
console.log(obj.printA())
console.log(obj.printB())
when you write a variable with var like var a it become a function
level variable. so now a is a variable which is present there before consol.log(a) and its not given a value so its undefined for b there is no variable defined with name b before it called.
And which all variables are defined with var will be function level variable and will be created before anything else in the function. so a will be present in the function at the starting itself.
and here this will be holding the object of Windows.
First of all, you are trying to examine the variables before you declared them.
This is the correct order:
function test()
{
var a=5;
this.b=10;
console.log(a); // Should print 5
console.log(b); // Should print undefined
console.log(this.b); // Should print 10
}
Second, regarding your question, declaring a var inside your function, make is a local private variable inside your function.
declaring this.b, will cause b to be in a different scope, and b for itself as undefined. If you want to use b inside the function, use this.b.