JavaScript: Global Variable

We use global variable to share something across functions in JavaScript.

    Here is an example script showing
  • - How the global variable behaves in JavaScript,
  • - How we can create global variable, and
  • - How we can use it?

  <script>
	// A global variable. It can be defined like this as well: var testVar = 1;
	var testVar = 1;
	// A function to test global var
	function testFun() {
		// console.log will work if firebug is enabled. If it is enabled, check the console tag. or use alert()
		// It should output 1
		console.log(testVar);
		// now change the variable's value
		testVar = 2;
	}
	testFun();
	// what is my variable's value now!
	console.log(testVar);
	// Doesn't exist. Gives error.
	//console.log(testVar2);
	function testFunction2 () {
		// A global variable is available everywhere. But, I do not want to touch global variable or think about it!
		// Create a new one inside a function and it will not affect outside/global variable.
		// It is local variable / variable in local scope.
		var testVar = 4;
		// Output: 4
		console.log(testVar);
		// A variable without var keyword, will cause a global variable created once
		// this function is get called!
		testVar2 = 7;
	}
	testFunction2();
	// Output: 2
	console.log(testVar);
	// Output: 7
	console.log(testVar2);
  </script>

Then try the same code in this format: self executing anonymous function.

document.write("" + '#varscope{display:none}' + '');


  <script>
	(function() {
	// A global variable. It can be defined like this as well: var testVar = 1;
	var testVar = 1;
	// A function to test global var
	function testFun() {
		// console.log will work if firebug is enabled. Check the console tag. or use alert()
		// It should output 1
		console.log(testVar);
		// now change the variable's value
		testVar = 2;
	}
	testFun();
	// what is my variable's value now!
	console.log(testVar);
	// Doesn't exist. Gives error.
	//console.log(testVar2);
	function testFunction2 () {
		// A global variable is available everywhere. But, I do not want to touch global variable or think about it!
		// Create a new one inside a function and it will not affect outside/global variable.
		// It is local variable / variable in local scope.
		var testVar = 4;
		// Output: 4
		console.log(testVar);
		// A variable without var keyword, will cause a global variable created once
		// this function is get called!
		testVar2 = 7;
	}
	testFunction2();
	// Output: 2
	console.log(testVar);
	// Output: 7
	console.log(testVar2);
})();
// Output: outside: testVar2 = 7. Why it is working then? It should be not defined, isn't it?
// It should not be! As this is defined without "var" keyword. and self executing anonymous function is also a function.
// Therefore, variable defined without 'var' keyword is available outside it. So, better define variable with
// var keyword, if you do not mean to use in anywhere.
console.log('outside: testVar2 = ' + testVar2);
// Output: testVar is not defined
console.log('outside: testVar = ' + testVar);
  </script>

Whatever you understood about variable in JavaScript is also applicable for function in JavaScript. In JavaScrpt, functions are treated like ordinary variable.

Too many global variable can impact performance and can cause conflict among the variables.

Comments are open for an year period. Please, write here on Facebook page.