Essential Javascript -- A Javascript Tutorial
By Patrick Hunlock2007-12-02
Variables
|
|
Javascript is not a strongly typed language which means you rarely have to concern yourself with the type of data a variable is storing, only what the variable is storing and in Javascript, variables can store anything, even functions.
var thisIsAString = 'This is a string';
var alsoAString = '25';
var isANumber = 25;
var isEqual = (alsoAString==isANumber); // This is true, they are both 25.
var isEqual = (alsoAString===isANumber); // False one is a number, the other a string.
var concat=alsoAString + isANumber; // concat is now 2525
var addition=isANumber + isANumber; // addition is now 50
var alsoANumber=3.05; // is equal to 3.05 (usually).
var floatError=0.06+0.01; // is equal to 0.06999999999999999
var anExponent=1.23e+3; // is equal to 1230
var hexadecimal = 0xff; // is equal to 255.
var octal = 0377; // is equal to 255.
var isTrue = true; // This is a boolean, it can be true or false.
var isFalse= false; // This is a boolean, it can be true or false
var isArray = [0, 'one', 2, 3, '4', 5]; // This is an array.
var four = isArray[4]; // assign a single array element to a variable.
// in this case four = '4'
var isObject = { 'color': 'blue', // This is a Javascript object
'dog': 'bark',
'array': [0,1,2,3,4,5],
'myfunc': function () { alert('do something!'); }
}
var dog = isObject.dog; // dog now stores the string 'bark';
isObject.myfunc(); // creates an alert box with the value "do something!"
var someFunction = function() {
return "I am a function!";
}
var alsoAFunction = someFunction; //No () so alsoAFunction becomes a function
var result = alsoAFunction(); // alsoAFunction is executed here because ()
// executes the function so result stores the
// return value of the function which is
// "I am a function!"
A variable may not be a Javascript reserved word or begin with a number or any symbol other than $ or _. In Internet explorer you should also avoid variable names with the same name as html elements you have named. For instance…
var someDiv = document.getElementByID('someDiv');
…will cause problems in Internet Explorer because the variable name and the division name are identical.
In recent years a convention has formed around the use of the $ symbol as various libraries like Prototype and JQuery use it to look up a named HTML element. For most purposes if you see $('something') in Javascript you should read that as being document.getElementById('something'). This is not standard Javascript, in order for $('something') to work, you need to be using a Javascript framework which will define $ as doing something (Like JQuery, Prototype, etc).
The use of a leading underscore (_) is generally useful to indicate a global variable or a variable that has been set outside the current scope.
A final consideration on variables is that functions themselves can be defined like, and act like variables. Once a function has been defined it can be passed to other functions as an argument (A process knows as lambda), or assigned to other variables just like a string, array or any other Javascript object. Generally if you use a function without trailing parenthesis (), the function is treated like a variable and can be passed and assigned. Trailing parenthesis INVOKE the function, executing it and passing back the return value (if any).
Please note that this is a very broad summary overview of Javascript's data types. For more information please see the other articles in this series (listed at the top of the page) which go into exhaustive detail on each Javascript type.
Tutorial Pages:
» Essential Javascript -- A Javascript Tutorial
» Getting Started
» In-Line Javascript
» External Javascript
» Javascript is case sensitive
» Output (writeln)
» Output (alert)
» Output (getElementById)
» Input (One Click To Rule Them All)
» Input (User Input)
» Javascript is an Event Driven Language
» Comments
» Variables
» Variable Scope
» Special Keywords
» Arithmetic Operators
» Logical and Comparison Operators
» JavaScript Conditionals: IF
» JavaScript Conditionals: SWITCH
» JavaScript Conditionals: Shorthand Assignment
» JavaScript Conditionals: Ternary Operators
» JavaScript Loops: FOR
» JavaScript Loops: FOR/IN
» JavaScript Loops: WHILE
» Bringing It All Together
» DHTML: Dynamic HTML
» Conclusion
copyright © 2006, 2007 by Patrick Hunlock
