DEV Community: Nirjal Mahat

Hoisting in Javascript Explained

Nirjal Mahat — Thu, 08 Jun 2023 16:19:21 +0000

In this article, we will take a brief look at hoisting in Javascript. Hoisting is a behaviour of Javascript which occurs before the code execution where all the variables and function declaration are moved to the top of their scope.

During the compilation process, before the code is executed, the Javascript engine first scans through the code and "lifts up" all the variable declarations and function declarations to the top of their scope.

For example, if you have a variable declaration like var firstName = "Elon"; inside a function, hoisting will move that variable to the top of the scope. So, even if you wrote the declaration later in your code, you can still use that variable from the beginning of the function.

However, it's important to note that only the declarations are hoisted, not the initial values. So, if you declared a variable as var firstName= “Amadeus” in line 5 and console log it in line 3, which is before the variable declaration, you might think that you will get an error as the variable is defined later in the code so it would be accessible before the definition, but you will see “undefined” as the output. But you set the value to “Amadeus” so why did you got undefined? That is because only the declarations are hoisted and not the actual value. Before the code execution reaches the line where the variable is actually declared it will be undefined and when the code reaches the declared line the variable will be initialized meaning it will now be set to whatever the value you set it to. The variable hoisting behaviour in Javascript is only seen when you use the var keyword to declared the variable and not with the let or const keyword. Also keep in mind that the variable will be hoisted at the top of its scope so if you have a variable defined inside a function the variable will be lifted at the top of the function only and not of the entire code or not outside of the function.

This behaviour is also seen with functions in Javascript. Function defined with the function keyword will be hoisted, meaning that the function can be used even before defining them.

console.log(declaredWithVar) // Output: undefined - because the variable is hoisted
console.log(normalFunction()) // Output: I am a normal function - because the fuction is hoisted


var declaredWithVar = 2; // this will be hoisted or lifted at the top of its scope
let declaredWithLet = 5; // this won't be hoisted
const declaredWithConst = 8; // this won't be hoisted

const arrowFunction = () => {
  return "I am an arrow function"
}

function normalFunction () {
  return "I am a normal function"
}

To interpreter the above code looks like this:

var declaredWithVar; // hoisted

function normalFunction () { //hoisted 
  return "I am a normal function"
}

console.log(declaredWithVar) // Output: undefined - because the variable is hoisted
console.log(normalFunction()) // Output: I am a normal function - because the fuction is hoisted

declaredWithVar = 2; // this will be hoisted or lifted at the top of its scope
let declaredWithLet = 5; // this won't be hoisted
const declaredWithConst = 8; // this won't be hoisted

const arrowFunction = () => {
  return "I am an arrow function"
}

That should give you a good introduction about hoisting in Javascript. However, if you still have confusions and want to dive a bit deeper, here is a good article from DigitalOcean.
https://www.digitalocean.com/community/tutorials/understanding-hoisting-in-javascript

Thank you.

Which Programming Language should I learn as a complete beginner?

Nirjal Mahat — Wed, 20 Jul 2022 12:26:00 +0000

Which Programming Language should I learn as a beginner?

This is one of the most frequently asked question in the Coding Community and since there are thousands of Programming languages to choose from, it is no wonder that it's really overwhelming for someone with very little knowledge related to the field. Obviously, the Internet is filled with enough Videos and Articles about this topic. In this post, I will be sharing with you my opinion regarding the topic.

My answer to the question is not going to be like learn Python, JS, or any other languages. I would rather suggest you something different.

Firstly I would suggest you to learn some programming fundamentals.

The best way to start is by watching Havard’s CS50 Course which is free and available on youtube. Watch the first video of the playlist.

Also don’t miss Crash Course’s Computer Science.

The above-mentioned courses really give you an amazing advantage over directly jumping into writing some lines of code without knowing some fundamentals. They teach you what you are about to learn, why you should learn them and all. They are the perfect introduction for a beginner to the programming world in my opinion. I really love the Crash Course’s CS and I am currently watching it. It is filled with great informations that I recently discovered and had answers to some of my burning questions about programming and also answers to some questions that I never thought about. At times the course can be a bit complicated as a complete beginner but just keep going. You don't have to watch each and every video on the playlist, just watch those that interests you.

Something that you need to know as early as possible is that, coding is a huge field. It’s not that you learn a programming language and now you know everything from making Websites to Mobile Apps to Desktop Application to Game Development and so on. For every Programming field, be it Game Development, ML/AI or anything, some specific set of tools and technologies are involved. So before jumping into a programming language you first need to decide the field that interests you the most. Below I have listed some Programming Language for specific fields. Decide your field of interest and select your choice of Programming language.

Frontend Web Development: Javascript
Backend Web Development: Python, PHP, Javascript, Java
Machine Learning and AI : Python, Java, C++, R, Javascript
Mobile App Development : Javascript, Java, Dart
Game Development : C++, C#, Java

Thank you for making to the end of the article. Please forgive me for any English or Grammatical related failures in the article.

Thank You!!!

Best Tech Related Book You Have Ever Read!

Nirjal Mahat — Sat, 29 Jan 2022 12:12:12 +0000

What are some of the best tech related books you have ever read that made you a better developer or expanded your knowlegde about tech? Book can be anything like related to a specific topics like blockchain, ML and AI, Web development and so on, or related to some programming language, or some tech figure's Biography or anything else

Best Learning Path to Master NextJS

Nirjal Mahat — Mon, 24 Jan 2022 09:00:35 +0000

Hello a Begineer Here. Trying to learn NextJS after learning a bit of React. If you are a NextJS Developer, can you please guide me towards your best way to mastering Next? As a NextJS developer what mistakes did you make at the beginning learning phase? What should I mostly focus on, what should I avoid as a begineer? What learning resources do you suggest? Currently I am going through Fireship's Next-Firebase course. I find it great. What else should I do?