Register to get access to free programming courses with interactive exercises

Naming JavaScript fundamentals

Naming

Imagine the code from the previous lesson looks like this:

let x = 'Father!';
console.log(x);
console.log(x);

Although it works, the variable name is now x. A computer doesn't care about naming since it's a mindless machine, but developers do care. We are mostly read someone else's code, then write or read our own. Quality and clarity of variable names is half the battle when it comes to code analysis.

It's best take a moment and come up with a name reflecting the essence and meaning of the variable than give it a random name and rename it later. Try to name variables to make them as comprehensive as possible without context, or without examining the surrounding code.

A common joke among developers is that "the hardest part of programming is cache invalidation and naming things". Coming up with names is tough indeed. How would you name a variable that stores the number of unpaid orders from customers in debt from the previous quarter?

Self-check. Think of a name for the variable that would store "the number of siblings the king has". Write it down in a notebook or send it to yourself. Don't put anything in there except the name of the variable. And we'll come back to this topic in a few lessons ;-)

Naming styles

greeting is an example of a simple name, although not all of them are that simple. Often, they are a combination of several words. For example, "user password". Different languages have different naming styles for variables.

Three main variable naming conventions are sometimes combined. These conventions apply to variable names consisting of several words:

  • kebab-case – a hyphen separates the parts of the name. For example, my-super-var
  • snake_case - an underscore is used as a separator. For example, my_super_var
  • CamelCase - each word in the name is capitalized. For example, MySuperVar
  • lowerCamelCase - each word is capitalized except the first. For example, mySuperVar

Javascript uses CamelCase and its variation lowerCamelCase, with the first letter of the first word in lowercase. We use lowerCamelCase for variables. It means we concatenate the words, and all the words apart from the first are capitalized: userName. With three words it looks like this: mySuperVariable.

Magic numbers

Let's remember one of the previous lessons:

let dollarsCount = 50 * 1.25; // 62.5
let rublesCount = dollarsCount * 60; // 3750

console.log(rublesCount);

From the developer's point of view, such code "smells". It means that the code is hard to comprehend. Even now, when you look at the numbers 60 and 1.25now, you might find yourself asking, "What are those numbers?" Imagine reading it in a month from now! How could a new programmer who hasn't seen the code before understand it? In our example, you can reconstruct the context through proper naming, but in real life, the code is much more complicated, and it is often impossible to guess the meaning of numbers.

This "smell" is known as Magic Numbers. The numbers with an inexplicable origin, which you can only understand by digging deeper into the code.

The solution is simple: create variables with the right names, and everything will fall into place.

let dollarsPerEuro = 1.25;
let rublesPerDollar = 60;

let dollarsCount = 50 * dollarsPerEuro; // 62.5
let rublesCount = dollarsCount * rublesPerDollar; // 3750

console.log(rublesCount);

Note the following details:

  • lowerCamelCase naming
  • The two new variables are separated from the following computations by an empty line. These variables are meaningful even without a computation involved, which is why this separation is suitable here: it improves readability
  • The code is well named and structured, but it is longer than the previous version. It happens every so often and that's okay. The code must be readable

Recommended materials

  1. Naming in Programming
  2. Naming Mistakes to Avoid in Programming

Sign up

Programming courses for beginners and experienced developers. Start training for free

  • 130 courses, 2000+ hours of theory
  • 1000 practical tasks in a browser
  • 360 000 students
By sending this form, you agree to our Personal Policy and Service Conditions

Our graduates work in companies:

Bookmate
Health Samurai
Dualboot
ABBYY