The var keyword is a global and function-scoped keyword that many programmers use. But there are cases where the const or let keyword could be a better option. So, in this study, we will explain with examples how you can use any of these keywords. Dive in!
Note: We will use functions in these examples, but do try to understand how the var and const keywords are used. We have an article coming up where you will learn about function.
JavaScript var Keyword
First, you must understand that var is the oldest of the declaration keywords. Before let and const were added to the mix in 2015, it had been in use since 1995. Thus, the keyword var
should be used when writing programs that need to work in older browsers.
a. Case one
// this line of code initialize and assign value to the variable with var globally
var acct = 10
// here we create a quick function
function account_info(){
// we are trying to print a global variable from a block scope
console.log(acct)
}
// it make a call to the function
account_info();
// print the value of acct declared globally
console.log(acct);
#Output
10
10
Although the var acct was globally initialized in this example, we can still access it both inside the function block and outside of it.
b. Case two
var acct = 110
console.log(acct)
// with var, you can re-declare and assign new value
var acct = 80
console.log(acct)
// you can update var variable without any keyword
acct = 73
console.log(acct)
#Output
110
80
73
c. Case three
// create a function and declare
function account_dv() {
// we declared a variable in a function scope and it is accessible here
var acct = 10;
console.log(acct)
}
account_dv();
// trying to call the acct variable outside of function
console.log(acct);
#Output
10
app.js:5
ReferenceError: acct is not defined
at Object.<anonymous> (c:\Users\zmera\Desktop\javscript\app.js:11:17)
at Module._compile (node:internal/modules/cjs/loader:1112:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1166:10)
at Module.load (node:internal/modules/cjs/loader:988:32)
at Module._load (node:internal/modules/cjs/loader:834:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
at node:internal/main/run_main_module:17:47
No debugger available, can not send 'variables'
A variable declared with the var keyword inside a function is not accessible outside. It throws an error like the one you see in the example when you try to do it outside the function.
JavaScript let Keyword
The let keyword is block scoped because it cannot be used outside of a function block…
a. Case one
// initialize a variable using the let keyword globally
let acct = 70;
// create a function and initialize another variable with let keyword
function account_dv() {
// this is a function block scope variable
let acct2 = 90
// print the block scope value
console.log(acct2);
// print the global scope value
console.log(acct);
}
// function call to run the code
account_dv();
#Output
70
90
In the above example, let variable is accessible in a function when initially declared globally.
b. Case two
// global initialization
let acct = 21;
function acct_dv() {
if (true) {
// variable b initialized in an if block
let b = 4
console.log(b);
}
// trying to call a variable initialied in a different function block
console.log(b);
}
acct_dv()
// It prints 21
console.log(acct)
#Output
21
ReferenceError: b is not defined
at acct_dv (c:\Users\zmera\Desktop\javscript\app.js:12:17)
at Object.<anonymous> (c:\Users\zmera\Desktop\javscript\app.js:14:1)
at Module._compile (node:internal/modules/cjs/loader:1112:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1166:10)
at Module.load (node:internal/modules/cjs/loader:988:32)
at Module._load (node:internal/modules/cjs/loader:834:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
at node:internal/main/run_main_module:17:47
In the above example, trying to use the value of a variable declared in another block scope in a new one is not possible.
c. Case three
let a = 130
// trying to redeclare a variable with a let keyword is not possible
let acct = 10
// It is possible when you use the non keyword strategy
acct = 18
// this line of code uses a conditional statement(if) to print the value of acct
if (true) {
let acct=99
console.log(acct) // It prints 99 which is in the block scope
}
console.log(acct) // It prints 18 whichis the last value it was updated to globally
#Output
99
18
You cannot declare a variable with the let keyword twice. But you can do it without adding any keywords.
JavaScript const Keyword
Use the const keyword to ensure that a variable’s value stays constant and is not affected by updates. But you can declare it inside a block scope. This is to say that a global variable is not found in a function scope.
// declare a statement with const keyword
const a = 192;
// the code below create a function where we try to assassin a new value to a
function acct_dv() {
// we try givina a new value
a = 92
console.log(a)
}
// a call to the function to print result
acct_dv();
Running the above code will result the following error.
TypeError: Assignment to constant variable.
at acct_dv (c:\Users\zmera\Desktop\javscript\app.js:8:7)
at Object.<anonymous> (c:\Users\zmera\Desktop\javscript\app.js:13:1)
at Module._compile (node:internal/modules/cjs/loader:1112:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1166:10)
at Module.load (node:internal/modules/cjs/loader:988:32)
at Module._load (node:internal/modules/cjs/loader:834:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
at node:internal/main/run_main_module:17:47
In the example, a const variable cannot be re-initialized but, when initialized globally, is visible in a block scope.
Conclusion
In this article, we were able to use examples to explain when you should use var, ket, and const keywords.