var keyword, which stands for variable. For a number of applications you can actually exclude this keyword and it'll work just fine, but the keyword always makes sure that you are creating a new variable rather than setting the value of an already-existing one in the cases where this matters (if you don't have a clue what I'm talking about, you'll see soon enough). After this keyword (optionally in most cases, as discussed), we specify the variable's name so we can reference it in our code, and if we just want to create an 'empty box' then we can just put our semicolon here to end the variable creation. This process of creating a variable is called the variable declaration. For example the following would create an empty variable called 'VariableOne':
To assign values to this variable we can write its name, followed by an equals sign, followed by the value we want to set it to (and remember, this can be any data-type you like). So if we wanted to create a variable called 'Greeting' and then set it to the string of text, "Hello!", then we might do something like the following:
Greeting = "Hiya!";. We can also get the value of the variable wherever we want by simply typing its name - so if we wanted to combine this with the alert function that we learnt in previous lessons to output the value of 'Greeting', we can just write the variable name in the
alert function's parameters. In the following example, we will set the new variable, 'Greeting', to something, output that in an
alert, then set the variable to something else, and
1 2 3 4 5
1 2 3 4
If you put all of the above in the 'script.js' file of the project folder that we set up previously, you should see that the pop-up boxes output exactly what we expected, "Hello!" and then "Hi!"!
If you want to just quickly test this simply script without setting up the whole project - there is an excellent service available called JSFiddle which is super awesome. I've embedded the code from this tutorial in a JSFiddle iframe below (you can run it by clicking the run button in the iframe) for quick testing.
- + - Addition
- - - Subtraction
- * - Multiplication
- / - Division
We can use these with constant number values such as '3' and '5', but also with variables that contain numbers. If we wanted to alert the value of 'myVariable' plus 5, we can simply use the '+' operator to do so, take for example the following:
It's also often useful to use the mathematical operators in variable assignment. So if we wanted 'VariableTwo' to be 'myVariable' times 5, we could do something like the following:
I think the usage of mathematical operators is generally pretty straightforward, so I'll leave the rest of finding out to you! Try messing about with operators in different places, and if you're feeling up for a little bit of a challenge, try creating a basic script in which 2 variables contain different lengths of triangle sides, and the third side is calculated using the Pythagoras' Theorem (Hint: As well as using the operators we've just covered, you're going to need to utilise the
sqrt method of the
Math object to square root values!).