Starting a JavaScript Blog Series

HashNode Bootcamp September 2021

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!