Beginner JavaScript – Chapter 6 – Variables

Javascript

Beginner JavaScript – Chapter 6 – Variables

by deconspray 0 Comment

Note:

As stated in my initial post, this is part of a series of JavaScript-related posts. As I am becoming knowledgeable in JavaScript, I am posting out what I’ve learned, to re-enforce my knowledge, as well as maybe helpful other web designers/developers in learning JavaScript. If I have mis-stated anything, please feel free to post it in the comments. You’ll help me, and others in learning JavaScript. Thanks!

What are Variables?

The sole purpose of a variable is to store a value. The reason why it’s called a variable is the value can change at any time within the JavaScript application. Variables are used throughout programming with JavaScript, there’s just no escaping them.

Before you can use a variable, you must declare it. To declare a variable, you use the var (for variable) keyword, followed by the identifier (or variable name).

Example:

var variablename
var totalCost

You can declare multiple variables in one statement by separating them with commas.

var totalCost, preTaxCost, taxAmount

Once a variable is declared, you can assign it a value. To assign a value to a variable, you use the assignment operator (=). Example:

lastName = Deacon;
totalCost = 120;

A shortcut (and the typical way developers write code today) is to combine the declaration and assignment all in one statement. Example:

var lastName = "Deacon";
var netTotal = 120;
var tax = netTotal * 8.5%
var totalCost = netTotal + tax;

In the first example above, the text string “Deacon” is assigned to the variable lastName (text strings are always enclosed with quotation marks). In the second example, the value 120 is assigned to the netTotal variable. In the third example, the variable tax is assigned the value assigned to the variable netTotal, multiplied by 8.5 percent. In the last example, the values of the variables netTotal and tax are added together, assigning the resulting value to the variable totalCost.

Confused? Good (based on the fact you answered no, of course).

Following are the various assignment operators (yes, there are more than just =):

  • = Assigns the results/value on the right to the variable on the left.
  • += Adds the results/value on the right to the variable on the left.
  • -= Subtracts the results/value on the right from ythe variable on the left.
  • *= Multiplies the variable by the result of the expression.
  • /= Divides the variable by the result of the expression.
  • %= Stores the modulus of the variable and the result of the expression in the variable.

Note: If an expression contains both a string and number, the number is converted to a string before the expression is processed.

Here’s some examples of common scenarios where these expressions would be used.

var total = 23.95;  -  the variable total contains the value 23.95
grossTotal = total += 76.05; - the variable grossTotal contains the value 100.00
var firstName = "Dennis";
var lastName = "Deacon";
var name = firstName + " " + lastName;
var fullName = "Dennis";
fullName += " ";
fullName += "Deacon";