Code Smell 213 - Hoisting

You can prevent undefined

TL;DR: Declare your variables and watch the scope

Problems

• Readability

• Least Surprise Principle violation

• Variable Shadowing

Solutions

1. Be explicit on declarations

2. Use 'const' declaration when possible.

3. Declare variables at the beginning of the scope.

4. Use strict mode

Context

Hoisting allows variable declarations to be moved to the top of their containing scope during the compilation phase.

Variables declared with var and function declarations are "hoisted" to the top of their respective scopes automatically in several languages.

Sample Code

Wrong

console.log(willBeDefinedLater); 
// Output: undefined (but no error)

var willBeDefinedLater = "Beatriz";
console.log(willBeDefinedLater); 
// Output: "Beatriz"

Right

const dante = "abandon hope all ye who enter here"; 
// Declaring a constant 'dante'
// with value "abandon hope all ye who enter here"

console.log(dante); 
// Output: "abandon hope all ye who enter here"

dante = "Divine Comedy"; // Error: Assignment to constant variable

Detection

[X] Semi-Automatic

We can perform mutation testing to check if changing the scope of the variables brings unexpected results.

Tags

• Mutability

Conclusion

Hoisting is yet another magic tool some compilers provide to favor lazy programmers.

But if it fights back in debugging time.

Relations

Code Smell 116 - Variables Declared With 'var'

Maxi Contieri ・ Feb 23 '22

Code Smell 42 - Warnings/Strict Mode Off

Maxi Contieri ・ Dec 4 '20

#oop #codenewbie #webdev #tutorial

More Info

Wikipedia

Disclaimer

Code Smells are my opinion.

Credits

Photo by Ash from Modern Afflatus on Unsplash

---

The best error message is the one that never shows up.

Thomas Fuchs

Software Engineering Great Quotes

Maxi Contieri ・ Dec 28 '20

#codenewbie #programming #quotes #software

---

This article is part of the CodeSmell Series.

How to Find the Stinky parts of your Code

Maxi Contieri ・ May 21 '21

#codenewbie #tutorial #codequality #beginners