As part from Hashnode's September bootcamp, we were asked to start a series and write our first entry.
I would like to use this post to also state how I would be building such a series by answering some key questions, which will act as guidelines:
Is it possible to write more than 2 articles about this subject?
Yes! In fact, since JavaScript is one of the most popular programming languages at the moment, there is a lot of progress and work on it, including a lot to share!
Will this series be linear?
No. Personally, I prefer to write articles that can be consulted individually and quickly. None less, if there is a subject that deepens in complexity and has to be divided in several articles, I will link them appropriately.
Since the series's beginning was clarified, we may start with the first post!
JavaScript Variable Scope
In this article I wish to present what is scope, and why it matters in JavaScript's variables.
First of all, scope is the area of the program where a variable, function, object, etc. can be called trough their identifier (name).
Different items in JavaScript have different accessibility, or scope in our program. For example, one of the scope limitations on a variable is that it cannot be called before being declared.
JavaScript has three types of scope which are:
- Global scope: Variables that are created outside blocks and functions, which are accessible to any line of code in the file. They are usually at the root of the program.
let myVar = 183; // acts as a global variable to the following statements
function returnValue(){
return myVar;
}
const writeValue = () = >{
console.log("One hundred eighty-three");
};
document.writeln(myVar);
- Local scope: They are variables declared inside a function and can only be used inside it. It also means that variables with the same name can be used in multiple functions.
If a local variable is called outside its scope it will throw a Reference error.
const printMyName = () => {
var myName = "Simon";
document.writeln(myName);
};
console.log(myName); // Will throw a Reference error.
const upperCasePrintName= () => {
var myName = "Simon";
document.writeln(myName.toUpperCase());
}
- Block scope:
Variables that are declared inside a block (limited by "{}", as if statements or for loops) cannot be used outside that same block. As example:
// "If" block statement
if(false){
let myFavoriteColor = "cyan";
}
console.log(myFavoriteColor); // It won't work!
Note: Variables declared using var do not have a block scope, meaning that if myFavoriteColor was a var, the console.log(myFavoriteColor); would work fine.
{ // Example of a block
const myNumber = 5;
}
console.log(myNumber); // myNumber cannot be used here,
// it will throw an error.
if(true){
var numberOfApples = 6; // Will work - no block scope
const TAX_RATE = 0.15;
let myName = "Rafael";
}
console.log(numberOfApples); // Will work
console.log(TAX_RATE); // Error!
console.log(myName); // Error!
Conclusion
Thank you for reaching the end of the article. I hope you liked!