What is the scope of this global / function variable? [duplicate] - javascript

This question already has answers here:
What is the scope of variables in JavaScript?
(27 answers)
Closed 4 years ago.
In the following code, shouldn't x be considered a global variable? Thus, when it gets to the console.log line x it should have the value of "World". However, when I run this code it logs "Hello undefined". `
let x = "World";
function sayHello(x) {
console.log("Hello ", x);
}
sayHello();
But when I change the parameter to y, it then works as I expected, logging "Hello World.
let x = "World";
function sayHello(y) {
console.log("Hello ", x);
}
sayHello();
Can someone explain what is going on here?
thanks

The x parameter in sayHello(x) shadows the global let x = "World";. If you pass a value in, sayHello("Hello"), you would get an output, Hello.

Try calling sayHello(‘Stack Overflow’). I’m sure you can guess whet the result will be.
The function is expecting x to be the first argument passed to the function. If no argument is passed, the argument x is undefined.
The technical term for what happened here is shadowing. The argument named x shadows the variable named x, even if no value is passed for the argument.

Related

Javascript lambda function does not see variable from parent scope [duplicate]

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.

Can someone explain x and y in this "function factory"? [duplicate]

This question already has answers here:
What do multiple arrow functions mean in JavaScript?
(7 answers)
Closed 5 years ago.
From this documentation on closures:
function makeAdder(x) {
return function(y) {
return x + y;
};
}
var add5 = makeAdder(5);
var add10 = makeAdder(10);
console.log(add5(2)); // 7
console.log(add10(2)); // 12
I can't understand how in makeAdder(5) the parameter is received as x, but in add5(2) it is y.
I would expect it to say y is undefined both times. Can anyone explain how it works the way it does?
When you call makeAdder() it returns a function (not a value). Therefore to use it, you would have something like
makeAdder(4)(5)
This would add 4 to 5 and return 9. Again, makeAdder() here returns another function, which is why I called an argument after it ((5)).
If you would like to read further, this is a concept in JavaScript which is called currying. It is a functional programming technique.
When calling add5 = makeAdder(5); essentially what is happening is:
add5 = function(y){
return 5 + y;
}
At this point add5(y) will give you y + 5.
As you've noticed from your comment you can use makeAdder(x)(y), this essentially does the same thing, it boils down to:
(function(y){return x + y})(y);
makeAdder takes a parameter x, and returns a function that can see x (google: "closure") and also takes its own parameter, y.

'var a' vs 'this.a' in function block [duplicate]

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.

Difference between declared function with name and without name [duplicate]

This question already has answers here:
Why JavaScript function declaration (and expression)?
(5 answers)
Closed 7 years ago.
can anybody tell me whats the difference between this two examples:
//difference with this:
var x = function withName(a,b,c) {} //why i should declare a name here?
//and this
var y = function (a,b,c) {}
According to the ECMA specification, a function can be written either through declaration or through expression,
Declaration is writing function as below,
function withName(a,b,c) {
}
With declaration, it is required to write an identifier which in this case is withName
Both the example that you have given are of function expression where it is not required to write the identifier i.e. withName as you can still call this function with the variable x or y
var x = function withName(a,b,c) {}
var y = function (a,b,c) {}
However, the only difference here is that if you don't specify the identifier you are creating a anonymous funtion.
You can see this link for detailed explanation.
On this particular case, there is no difference. But in general, the fact that the function assigned to a variable has a name, makes it possible to invoke the function from inside the same function (recursion).

Why does one variable change but the other does not? [duplicate]

This question already has answers here:
Is JavaScript a pass-by-reference or pass-by-value language?
(33 answers)
Closed 8 years ago.
While some people are saying that this question has been answered before, its only the answer that has been given before to a different question with much more specifics (ie. asking specifically about call-by-reference / call-by-value, whereas this question does not presuppose knowledge of eiither)
The following code appears to be very confusing. We can logically deduce that the reason why z.id updates after the function is because it is an object. But why? What particular trait or characteristic of javascript is doing this?
function changea(a) {
a = 100; // does not change a
} // no return
function changez(z) {
z.id = 100; // does change z
} // no return
var a = 0; // a is zero
changea(a) // a variable
alert('variable a is equal to ' + a); // why does this stay at zero?
var z = {id: 0};
changez(z);
alert('variable z.id is equal to ' + z.id); // why does this change to 100
see the demo here: http://jsfiddle.net/u0pysgjy/7/
In the first case a is passed by value to the changea function and in the second case z is an object and it is passed by reference to the changez function.Whenever a function gets a variable which is passed to it by value, even if you change the value it will not reflect outside of the function which is the case of a. And if a function gets its parameter which is passed to it by reference if you change the value of its property it will be reflected outside of the function also.
There is a nice explanation here

Categories

Resources