I am learning javascript and today i'm learning about the scope chain.
So apparently you can access the variable of the global scope even inside 3rd or 4th function scope.
I don't really get why wouldn't you declare all of your variables in the global scope to be able to access them everywhere and every function that you create ?
so why not :
var a = 'Hello!';
var b = 'Hey!';
var c = 'Hola!';
function first (){
//some function you want to do
second();
function second () {
console.log(a + b + c);
}
}
Instead of :
var a = 'Hello!';
function first (){
//some function you want to do
var b = 'Hey!';
second();
function second () {
var c = 'Hola!';
console.log(a + b + c);
}
}
Related
This question already has answers here:
Javascript function scoping and hoisting
(18 answers)
Closed 6 years ago.
I just can't understand why the the a1 = function ?
and where is my value 1 that was passed to the fn(),
whether it was overrwrited by var a ?
the problem look like caused by the same names( var & function) !
function fn(a) {
console.log("a1 = " + a);
var a = 2;
function a() { }
console.log("a2 = " + a);
}
fn(1);
// a1 = function a() { }
// a2 = 2
function fnx(ax) {
console.log("a1 = " + ax);
var ax = 2;
function b() { }
console.log("a2 = " + ax);
}
fnx(1);
// a1 = 1
// a2 = 2
/* it equal to the final version */
function fn(a) {
var a;
a = function() { }
// function hoisting > variable hoisting
console.log("a1 = " + a);
a = 2;
console.log("a2 = " + a);
}
fn(1);
// a1 = function a() { }
// a2 = 2
I just can't understand why the the a1 = function ?
Function declarations are:
Hoisted to the top of the function they appear in
Declare a local variable (with the same name as the function) in the scope of the function they appear in (this isn't relevant because argument definitions do that too)
Assign themselves as the value of that variable
and where is my value 1 that was passed to the fn(),
Overwritten by the function declaration
whether it was overrwrited by var a ?
The var is ignored because there is already a local variable named a.
The assignment overwrites the function between the two console.log statements.
Your code is effectively the same as:
function fn(a) {
a = function a() { };
console.log("a1 = " + a);
a = 2;
console.log("a2 = " + a);
}
fn(1);
Consider the following :
var a = 5;
var b = function ()
{
console.log (a + 5);
};
var c = b.toString();
after the above has been executed, c will be equal to :
"function ()
{
console.log (a + 5);
}"
How can I have c be equal to :
"function ()
{
console.log (5 + 5);
}"
instead?
I tried the following :
var a = 5;
var b = function ()
{
console.log ('<%a%>' + 5);
};
var c = b.toString().replace('<%a%>', a);
But the above obviously makes c equal to :
"function ()
{
console.log ('5' + 5);
}"
Is there some other way of achieving this (javascript + RegEx) without using libraries like underscore (with the known template function) ?
Basically I'm trying to come up with a neat function that will convert a function into a string while at the same time replacing all variables (that have a hardcoded value) present in that function with their respective values, without the use of any variables.
Thanks
You can fix your snippet by changing the first argument of .replace:
var a = 5;
var b = function ()
{
console.log ('<%a%>' + 5);
};
var c = b.toString().replace("'<%a%>'", a);
For more generic solution you may need smarter parser with syntactical analysis.
I have a function that replaces characters from a string
function ratko(a) {
var k = a.toString();
var z = k.replace(/\,/g, '], [');
var s = z.replace(/\./g, ', ');
var final = "[[" + s + "]]";
alert(final);
}
What I need is to get the value of final outside the function like this:
var outsideValue = final;
EDIT!!! --
function ratko() gets it's value from ajax
success: function (data) {
if (data.success) {
alert("Note: This month has " + data.holidays.length + " holidays.");
praznici = data.holidays;
ratko(praznici);
}
else {
alert(data.ErrorMessage);
}
Possibility 1:
function ratko (a) {
...
return final;
}
var outsideValue = ratko (...);
Possibility 2:
var final;
function ratko (a) {
// no var final declaration here
...
}
...
ratko (...);
// now final has the value assigned to it in the function
You can access variables declared in an outer scope in an inner scope, which is what you do in Possibility 2.
One option would be to use a global variable, just declare it outside of the function.
var myvar = 1;
function myFunction()
alert(myvar); // 1
}
You can read more on javascript variables here.
You declare it outside the function scope:
var finalVar;
function ratko(a) {
var k = a.toString();
var z = k.replace(/\,/g, '], [');
var s = z.replace(/./g, ', ');
finalVar= "[[" + s + "]]";
alert(finalVar);
}
var outsideValue = finalVar;
Beware final is a reserved keyword in Javascript. I changed its name.
Besides that, keep in mind that Javascript is always parsed from top to bottom. So using a variable before declaring it will definitely give you an undefined.
you must be modify your function code like this
function ratko(a) {
var k = a.toString();
var z = k.replace(/\,/g, '], [');
var s = z.replace(/./g, ', ');
var final = "[[" + s + "]]";
//alert(final); comment this code line and replace this with the code above
return final;
}
after you can call your function ratko with this simple code
var inputValue = 'simple message';
var parsedValue = ratko(inputValue);
you find the final value into a new variable parsedValue
If I have a function, like this:
function f(x,y){
return x + y;
}
And if I have variables of parameters I want passed to f:
var parameter1;
var parameter2;
If I assign this function call to a variable:
var functionCallValue = f(parameter1,parameter2);
How can I ensure that functionCallValue changes depending on different values I assign to the variable parameter1 and parameter2?
I suppose what you need is a closure.
var servant = function(x, y) { return x + y; };
var param1 = 40;
var param2 = 2;
var master = function() { return servant(param1, param2) };
var result = master(); // 42.
param1 = 2;
param2 = 40;
var anotherResult = master(); // still 42, because that's really the answer!
functionCallValue is assigned the result (returnvalue) of your function f. (The function is called, the value calculated and the result handed over to your variable.) Thus functionCallValue does not automatically update, if you change the parameters (which would make no sense at all), you need to call the function again with the altered parameters.
For something like an auto-update you need a closure like this:
var asdf = (function(){
var param1 = 1;
var param2 = 2;
var result = param1+param2;
function compute(){
result = param1 + param2;
}
return{
param1:function(x){
param1 = x;
compute();
},
param2:function(x){
param2 = x;
compute();
},
result:function(){
return result;
}
}
})();
console.log(asdf.result()); // logs 3
asdf.param1(3);
console.log(asdf.result()); // logs 5
Demo
I want the variable i to be a counter, but it is being initialized to 100 each time.
How do I call myFunction().f() directly?
function myFunction() {
var i=100;
function f() {
i=i+1;
return i;
}
return f(); // with parenthesis
};
var X = myFunction();
console.log(X);
X = myFunction();
console.log(X);
You can't call f directly. It is wrapped in a closure, the point of which is to close over all the local variable. You have to expose it to the outside of myFunction.
First:
return f; //(); // withOUT parenthesis
Then just call X, as you'll have assigned a function to it.
var X = myFunction();
X();
This example would return 101 and 102: Be sure to try it.
function myFunction() {
var i=100;
function f() {
i=i+1;
return i;
}
return f; // without any parenthesis
};
var X = myFunction();
// X is a function here
console.log(X());
// when you call it, variable i gets incremented
console.log(X());
// now you can only access i by means of calling X()
// variable i is protected by the closure
If you need to call myFunction().f() that will be a pointless kind of closure:
function myFunction() {
var i=100;
function f() {
i=i+1;
return i;
}
return {x : f}
};
var X = myFunction().x();
// X now contains 101
var X = myFunction().x();
// X still contains 101
// pointless, isn't it?