DEV Community

Cover image for Code Smell | Magic Numbers
Jesús Mejías Leiva for Product Hackers

Posted on • Edited on • Originally published at blog.susomejias.dev

10 1

Code Smell | Magic Numbers

Hello, today we are back with the code smells refactoring series and in this case we are going to talk about code smell called Magic Numbers, this code smell can be detect when we use a number that lacks the proper semantics.


Cause

Numbers lacking semantics make calculations harder to read.


Example

As we can see in the following example we have 2 magic numbers that are quite easy to detect since it is really complex to know what type of calculation we are performing simply by observing these values: 4.50 and 0.21

function calculateTotal(subtotal) {
  const total = subtotal + 4.50;
  return total + (total * 0.21);
}
Enter fullscreen mode Exit fullscreen mode

Solution

By extracting both numbers to constants and giving them semantics we can see that the code is much more readable.

const SHIPPING_FEE = 4.50;
const SALES_TAX = 0.21;

function calculateTotal(subtotal) {
  const total = subtotal + SHIPPING_FEE;
  return total + (total * SALES_TAX);
}
Enter fullscreen mode Exit fullscreen mode

Benefits

  • Improvement the readability and maintainability of the code.
  • You will make the next person who needs to go through that part of the code very happy 😋 jiji

Thanks for reading me 😊

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (2)

Collapse
 
mcsee profile image
Maxi Contieri

Nice!!!

Collapse
 
susomejias profile image
Jesús Mejías Leiva

Thanks for you comment Maxi 😊

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs