JavaScript Tutorial – 03 – Variables

Declaring and Assigning variables

Variables are used to store values so that they can be accessed several times in a document. To create a variable the var keyword is used followed by the variable’s name. The variable can then be assigned a value with the assignment operator.

var myVar;
myVar = "Hello World";

The declaration and assignment of a variable can also be combined into one statement.

var myVar = "Hello World";

A variable’s name can include underscores characters and numbers, but it cannot start with a number. As for data types, JavaScript is an untyped language so any variable can hold any data type.

Integers

Integers can be represented with decimal, octal, or hexadecimal notation.

var a = 10;  // 10 with decimal notation
var b = 012; // 10 with octal notation (base 8)
var c = 0xA; // 10 with hexadecimal notation (base 16)

Floats

Floating-point numbers can be represented with either decimal or exponential notation. Note that all numbers in JavaScript are stored as floating-point numbers behind the scenes.

var d = 10.1;
var e = 0.1e2; // 10 with exponential notation (0.1*10^2)

Strings

Strings can be specified using either double or single quotes.

var a = "Hello World";
var b = 'Hello World';

To break a line within a string a backslash must be added. This character escapes the newline character which in JavaScript normally means the end of a statement.

var c = "Hello \
         World";

Escape characters

Backslash is used to add special characters to a string, such as newlines or quotes.

var a = "\' Single quote \
	    \" Double quote \
	    \\ Backslash \
	    \b Backspace \
	    \f Form feed \
	    \n New line \
	    \r Carriage return \
	    \t Tab \
	    \& Ampersand";

Boolean

For storing boolean values the keywords true and false can be used.

var a = true; // Boolean (true or false)

Null

For storing no value there is the null keyword, which is different from leaving out the assignment. When a variable is assigned to null it becomes undefined. This is equal to NotANumber for numbers, undefined for strings, and false when the variable is evaluated as a boolean.

var b = null; // No value
var c;        /* Undefined (NaN for numbers, "undefined" for strings, false for boolean) */

Variable scope

The scope of a variable depends on where it is declared. A variable that is declared outside of a function becomes a global variable and can be used anywhere on the page after where it’s been declared, even inside another script.

<script type="text/javascript">
  var a = 1; // global variable a
</script>
 
<script type="text/javascript">
  document.write(a); // 1
</script>

The lifetime of these variables starts when they are declared and ends when the web page is closed. On the other hand a variable declared inside a function becomes a local variable. It can only be used inside that function after where it has been declared and it will be destroyed when the function is finished. A local variable can use the same name as a global variable and thereby overshadow it for the duration of the function.

var a = 1; // global variable a   
function f()
{ 
  var a = 2; // local variable a (overshaddows global a)
}

There is also a second way of declaring variables by leaving out the var keyword and thereby declaring them implicitly. A variable declared like this will always become a global variable, even if it’s declared within a function.

function f()
{ 
  b = 5; // global variable b
}

Recommended reading:
Sams - Teach Yourself JavaScript in 24 Hours

PVT book:
Handbook of C++ Syntax