Sometimes, we need to store a piece of information so that we can refer to it — often multiple times — later on. In real life, we would probably jot down a note in a notebook or on a post-it.
Variables are assigned values using the = operator. Variable names are typically all lower case; in the case of multiple words, the words are joined together using lowerCamelCase.
Lets say I have the variable
word. We could, if we wanted to, write
word = 'bird'
in order to create our variable and assign it the value of the string
'bird'. Thing is, now we've declared a global variable. Global variables can be accessed anywhere in an application, which can lead to strange behavior.
Using a global variable is like passing someone a note on a billboard. Sure, it gets the message across, but way more people than necessary now have the message.
What if, for example, we wanted
word's value to be something other than
'bird' at some point in the application? Or what if we needed to make use of a variable called
word but not this particular
In the browser, global variables are all properties of
window. What is
window? Well, it's the — erm — window in which the browser displays the current page. It holds a whole bunch of things (which is probably obvious), global variables among them.
Accidentally setting variables to "global" is a dangerous, imprecise coding mistake.
var. Using the keyword
var creates local variable, meaning that it is only accessible inside the current function in which it is declared. (However, this is a bit tricky - If 'var' is not declared inside a function, it's actually still global!)
Here's how this works — follow along in your console!
// declare the variable var word // assign a value to the variable word = 'bird' console.log(word) // 'bird' // assign another value to the variable word = 'dog' console.log(word) // 'dog'
Now we have declared a local variable
word, and we can assign and reassign its value as we please.
We can perform variable declaration and assignment on the same line to save space:
var word = 'bird'
What does it mean that
word is a local variable? Well, if we're just entering it in the console, not much — the variable still becomes a property of
window, meaning... in this case, 'word" is a global variable (as mentioned above). (Go ahead, try typing
window.word in the console — prepare to be amazed!)
We'll learn more about local and global variables in a later lesson. For now, know that you should always declare a variable with
Let's say I needed to declare and define multiple variables. It feels like a lot to have to repeat
Let's condense the below code into one line:
var a = 5 var b = 2 var c = 3 var d = 'hello' var e = 'goodbye'
The above is equivalent to:
var a = 5, b = 2, c = 3, d = 'hello', e = 'goodbye';
which can be converted to:
var a = 5, b = 2, c = 3, d = 'hello', e = 'goodbye'
Try typing each variable in the console. You should see the appropriate values returned for each one.
Personally, we're of the opinion that it's best to declare each variable with its own
var keyword. The comma fanciness saves a little bit of typing, but at the expense of nonstandard indentation (you're using two spaces, right?) and can introduce a bit of weirdness if we're doing anything other than simple assignment.
Sometimes, information changes — we have to scratch out old notes and scribble in revisions.
var myNote = "Get milk" // later on myNote = "Get cookies"
When we change the value of a variable, we do not use
var again. We simply use the
= to give the variable a new value.