How do I define a global variable within a function in Javascript?

Question

Is there a way to define global variables within a function in Javascript like:

function Variables() {
global myText = "hello";
}

The problem is I have a lot of variables and DON'T want something like this:

var Site_height = document.documentElement.clientHeight;
var Site_width = document.documentElement.clientWidth;
var Box1_height = Site_height*0.5;
var Box1_width = Site_width*0.5;

function Resize() {
Site_height = document.documentElement.clientHeight;
Site_width = document.documentElement.clientWidth;
Box1_height = Site_height*0.5;
Box1_width = Site_width*0.5;
}

I would like something like this:

function Resize() {
global Site_height = document.documentElement.clientHeight;
global Site_width = document.documentElement.clientWidth;
global Box1_height = Site_height*0.5;
global Box1_width = Site_width*0.5;
}

That way I can call it when I like and it doesn't duplicate a heap of code.

Answer 1

I don't understand why you would wish to scope variables globally (to the window) and object to declaring them in that very context. You certainly don't need to ASSIGN values, just declare them outside the scope of any function definitions, e.g.,



var Site_height, Site_width,...;



The notion that all variables are global is, as you note, incorrect. The following sample discloses public and private members of a Function() object, as well as privileged access to a private field via a public accessor (getter).





















Why not use your function as an object prototype, create an instance, and use it?



function Resizer() {

// the assignments get run

// at construction, but,

// since the "this" vars are

// public, remain available

// for dot-reference under

// the instance namespace

// and can be changed or

// gotten at any time

var d = document;

var e = d.documentElement;

this.Site_height = e.clientHeight;

this.Site_width = e.clientWidth;

this.Box1_height = Site_height*0.5;

this.Box1_width = Site_width*0.5;

}



// construct one from the prototype

var R = new Resizer();



Now you can reference any of the public variables as R.var_name.

Answer 2

Public Variable Javascript

Answer 3

When you define your variables in global scope (not inside any function), they ARE already global variables.



Example:



var globalVar1 = 5;

var globalVar2 = "blah";

myFunc1();



function myFunc1 () {

alert (globalVar1); // this will alert: 5

alert (globalVar2); // this will alert: "blah"

globalVar1 = 10;

globalVar2 = "test";

myFunc2();

}



function myFunc2 () {

alert (globalVar1); // this will alert: 10

alert (globalVar2); // this will alert: "test"

}







------------------

Response to your additional details:



Please read the whole answer :)

Or probably read your own question again. There are some parts that are cut off (this site annoyingly cuts off long words), in case the missing parts changed what your question seems to be asking now.



In your example, you seem to think that you need to reassign the values of the global variables inside the function Resize(), while they already have their values assigned when they are defined in the global scope.



So what I'm saying is, after you have this:



var Site_height = document.documentElement.clien...

var Site_width = document.documentElement.clien...

var Box1_height = Site_height*0.5;

var Box1_width = Site_width*0.5;



the values are all set, and you can just use it in any function, without needing to reassign the values again.



e.g.: you can just have:

function Resize () {

document. getElementById ("box1"). style. height = Box1_height + "px";

document. getElementById ("box1"). style. width = Box1_width + "px";

}

Answer 4

No, you cannot define global variables inside of a method.

Answer 5

using global variables is bad practice, unless you use them as constants, i.e. never modify them.



var declarations are always global, even if they are inside a function.