Computer programs need memory to store some data that can be accessed later on, just like we write notes we want to remember later on like a phone number or address.
In computer software, a variable is like a box that contains a piece of information, to be saved for later use. You give it a name that describes what its contents are, and to also refer to it at a later point.
Here is an example how to declare and use a variable in JavaScript:
let score;
score = 94;
console.log(score)
Watch this short introductory video about variables
https://www.youtube.com/watch?v=7xStNKTM3bE
Key takeout from this video:
var is the old way of declaring variables of JavaScript. Use let instead= means assignment (i.e. storing data in a variable), not equality.varIn early versions of JavaScript, the var keyword was the only way to declare a variable. Modern JavaScript introduced two new keywords let and const for declaring variables. They improve on how the older vardeclaration works. Nowadays, everyone should use let but you will sometimes come across var in existing books, software libraries and examples on the Internet. The difference between var and let is not important now. Think of a let as the newer version of var .
<aside> ❗
Never use var to declare a variable. Use let or const instead.
</aside>
Your variable names must follow those basic rules:
_) and the dollar sign ($)Here are some examples for different variable names:
| Variable name | Is Valid | Comments |
|---|---|---|
first_name |
Valid | |
1_age |
Invalid | Starts with a number |
last name |
Invalid | Has a space |
add+ress |
Invalid | Has a special character |
function |
Invalid | Uses a reserved word |
_address |
Valid | Variables can start with underscore |
HELLO_WORLD12345 |
Valid | |
my-name |
Invalid | Hyphens are not allowed |
<aside> 💭
It is important to give your variable a name that describes what it is inside. We will cover this topic in detail later this week, in Code style: Basics
</aside>
Variable names are case-sensitive:
let age = 21;
let AGE = 22
let Age = 23;
age, AGE, and Age are three completely different variables. Pay close attention to upper and lower case letters when working with variables.
Initialize: to set (something, such as a computer program counter) to a starting position, value, or configuration (source)
You can declare a variable and then initialize it:
let firstName;
firstName = 'Bob';
Or, you can declare and initialize at the same time:
let firstName = 'Bob';
Don’t forget to initialize the variable before using it, using an uninitialized value can cause errors:
let firstName; // uninitialized variable
console.log(firstName);
Uninitialized variables receive a special value called undefined by default.
<aside> 💡
The most common practice is to declare and initialize a variable at the same time. It's shorter and easier to read.
</aside>
Variables can be changed over time:
let firstName = 'Bob';
console.log(firstName);
firstName = 'Alice';
console.log(firstName);
And can be even combined together:
let minutes = 10;
let seconds = minutes * 60; // seconds = 10 * 60 = 600
console.log(seconds); // 600
Take a look at this code
let minutes = 10;
let seconds = minutes * 60;
minutes = 5;
console.log(seconds);
💬 What will be the value of seconds at the end?
Constants are similar to variables, but their value cannot be changed after initialization. You declare a constant using the const keyword instead of let :
const color = 'green';
Changing a constant will cause an error when executing the code:
const color = 'green';
color = 'red'; // ❌ Error!
Using constants helps you avoid accidentally assigning a new value by mistake, which prevents bugs in your code. Constants are more predictable and easier to follow.
<aside> 💭
In JavaScript, it's common practice to always use const unless you need to change the variable.
</aside>
Read the full guide below for more important examples.
let age = 25;
console.log(age);
console.log('age');
What do you think will be the result output? Run the code to check your answer.
const number1 = 10;
const number2 = 3;
const Number3 = 5;
const answer = number1 + number2 + number3;
This code has an error, can you find it?