Quick Reference
In JavaScript, variables can be declared using three different methods: var, let, and const. Here are the differences between them.
| var | let | const | |
|---|---|---|---|
| When to Use: | General use when the variable is expected to change at a later time. | The let keyword should be used in situations where you want to declare a variable that should be restricted to the block { } in which it is declared. If declared outside a block { } it will be treated as global. | Use the const keyword if the variable that you are declaring should not be allowed to be reassigned in the future. They are also block { } scoped, and can only be accessed within the block they were declared. If declared outside a block { } it will be treated as global. |
| Value: | The variable can be declared without a value and will return "undefined". The value can also be changed at a later time. | The variable can be declared without a value and will return "undefined". The value can also be changed at a later time. | The value MUST be initiated at the time the variable is declared or it will return "undefined". The value CANNOT be changed at a later time. |
| Changing the Value: | The variable can be changed or even redeclared without an error. // allowed var x = 5; x = 6; // allowed var x = 5; var x = 6 | The variable can be changed but NOT redeclared. // allowed let x = 5; x = 6; // not allowed; error let x = 5; let x = 6; However, the if the variable is declared outside a block { } or in a different block { }, and then declared inside another block { }, it is allowed because they are all treated as different variables. | The variable CANNOT be changed and CANNOT be redeclared. // not allowed; error const x = 5; x = 6; // not allowed; error const x = 5; const x = 6; However, the if the variable is declared outside a block { } or in a different block { }, and then declared inside another block { }, it is allowed because they are all treated as different variables. |
| Scope (available for use): | Globally scoped if declared outside a function. Otherwise scoped to the immediate function, meaning that if the variable is declared inside a function it can be accessed only inside that function. | Globally scoped if declared outside a block { }. Otherwise scoped to the block { } it is declared in, meaning that if the variable is declared inside a block { } it can be accessed only inside that block { }. | Globally scoped if declared outside a block { }. Otherwise scoped to the block { } it is declared in, meaning that if the variable is declared inside a block { } it can be accessed only inside that block { }. |
| Hoisting: | Can be accessed even before they are declared; however, they will return "undefined". alert(x); var x = "Hello World"; This will return "undefined". | Although technically hoisted like the var keyword, variables declared with the let keyword are not subject to true hoisting. This means that you cannot use a variable unless it is first declared and initialized. alert(x); let x = "Hello World"; This will cause a reference error. | Although technically hoisted like the var keyword, variables declared with the let keyword are not subject to true hoisting. This means that you cannot use a variable unless it is first declared and initialized. alert(x); const x = "Hello World"; This will cause a reference error. |
JavaScript Notes:
- When using JavaScript, single or double quotation marks are acceptable and work identically to one another; choose whichever you prefer, and stay consistent
- JavaScript is a case-sensitive language; firstName is NOT the same as firstname
- Arrays count starting from zero NOT one; so item 1 is position [0], item 2 is position [1], and item 3 is position [2] … and so on
- JavaScript variables must begin with a letter, $, or _
- JavaScript variables are case sensitive (x is not the same as X)
We’d like to acknowledge that we learned a great deal of our coding from W3Schools and TutorialsPoint, borrowing heavily from their teaching process and excellent code examples. We highly recommend both sites to deepen your experience, and further your coding journey. We’re just hitting the basics here at 1SMARTchicken.