- A variable is a name for a value.
- You give a value a name using the assignment operator
- It looks like an equal sign but is not a comparison.
- often preceded by
letas in "Let there be light" or "Let X equal 10".
let color = "blue" let fruit = "berry"
- Anywhere you would use a literal value, you can use a variable instead.
color + fruit // "blueberry" fruit.toUpperCase() // "BERRY"
- ...so pick good names :-)
Let there be confusion
varis a lot like
letbut has wider scope which is sometimes bad
- If you don't use either
varthen the variable becomes global (which is dangerous)
- Moral: always use let unless you have a good reason not to
Don't let me down
let once per variable name (in a given scope), otherwise you will get an error:
Identifier 'x' has already been declared
> let x = 1 undefined > let x = x + 2 SyntaxError: Identifier 'x' has already been declared > x = x + 2 3
- also confusing: the value of a
undefined, but the value of a normal assignment is the value being assigned
The Warehouse Metaphor
Think of memory as a giant warehouse.
Like this warehouse from the movie Raiders of the Lost Ark, computer memory is vast and filled with boxes of various sizes.
The Warehouse Metaphor Explained
If memory is a giant warehouse...
...and memory locations are boxes in that warehouse
...then a value is the contents of a box
...and a variable is a label you stick on the outside of the box
Variables are documentation
Which is clearer, this:
60 * 60 * 24
let secondsPerMinute = 60 let minutesPerHour = 60 let hoursPerDay = 24 let secondsPerDay = secondsPerMinute * minutesPerHour * hoursPerDay
Lab: Play In Console
Some things to try:
- assign your birth year to a variable, then calculate your current age in years
- write a poem (with at least two lines) and assign it to a variable
- print the poem to the console with proper line formatting
- assign your best friend's name to a variable
- YELL YOUR BEST FRIEND'S NAME
- get a new best friend
- and YELL THEIR NAME TOO
The Pointer Metaphor
let snack = "Apple"
Think of a variable as an arrow pointing to a value.
You can assign and reassign variables at will.
color = "blue" // assign 'blue' to color fruit = "berry" // assign 'berry' to fruit color + fruit // 'blueberry' color = "black" // 'black' color + fruit // 'blackberry'
Reaassignment only changes the name of an object. It does not change the data inside the object.
This is analogous to removing a label from one box and placing it on a different box.
Tip: Did you get an
Identifier 'color' has already been declared error? Try again without the
Many pointers can point to the same thing
let fruit = "Apple" let snack = fruit
After this both
fruit are pointing to the same value
This is analogous to placing two labels on the same box.
Return values are new
Most messages return new values:
let fruit = "banana" let snack = fruit.toUpperCase()
"BANANA" are two different values in memory. The original value is still sitting around and still pointed to by
Most messages do not change the data inside the object.
let color = "blue" color.toUpperCase() // "BLUE" color // "blue"
But some messages do change the contents!
Changing Values Example
Let's say we have a friend named Joe and his birthday is Independence Day, 1990.
Date type to represent a year+month+day.
let independenceDay1990 = new Date(1990, 6, 4) independenceDay1990.toDateString() // 'Wed Jul 04 1990' let joesBirthday = independenceDay1990
Then we learn that Joe's birthday is actually Bastille Day. No problem, we'll just tweak the variable.
joesBirthday.setDate(14) joesBirthday.toDateString() // 'Sat Jul 14 1990'
But what happened to the original date?
independenceDay1990.toDateString() // 'Sat Jul 14 1990'
Oops! Our program now thinks Independence Day 1990 was on July 14. This is a problem. What's the solution?
Constants: Variables that Aren't Variable
- the keyword
constis just like
let, but also prevents reassignment
const pi = 3.14159;
- the value of a
constis constant after it's been set once
- if you try to change it, you get an error
pi = 7; TypeError: Assignment to constant variable.
constprevents reassignment but does not prevent changing the insides of objects (like the dates in the previous slide).
- variables are names for memory locations, which hold values
- declaring a variable says what its scope is
- assigning a variable changes which location it points to
- you can have many names for the same location
- sometimes values can change on the inside of a location
- (which is useful but could cause bugs)