How to Name Things in JavaScript

A well-known saying among programmers, attributed to Phil Karlton, is that there are only two hard things in computer science: cache invalidation and naming things.

I can’t claim to be an expert on cache invalidation, but like most JavaScript developers, I spend a lot of time naming things—whether it’s variables, functions, components, or modules. Naming things can indeed be tricky, especially when you consider that the names you choose today will affect not only you, but also the developers who will maintain your code in the future.

Naming things might be challenging, but it’s something developers do every day. Good names help you focus on the right areas of your code, while bad names can cause confusion, make maintenance harder, and lead to misunderstandings.

So how should you go about naming things in your JavaScript code?

1. Consider the User's Perspective, Not the Code’s

One of the first things to remember is to name things from the user’s point of view rather than from the perspective of the software.

It’s easy to get caught up in thinking about software architecture and how everything connects internally, but remember, the goal is to solve real-world problems for users. Naming things in a way that reflects users’ needs can help you better understand their problems and offer clearer solutions.

For example, I once worked with a rental company that expanded into multiple locations. I created a “multitenant” system with each location represented as a "tenant" object. The term made sense to developers because we were thinking about the architecture. However, for a rental company, the word “tenant” already had a different meaning — it referred to renters.

Had I considered the user’s perspective, I would have chosen a better term to avoid confusion. Unfortunately, the term “tenant” stuck, and now we’re stuck with it.

2. Keep It Simple

Once you’ve considered the user’s needs, the next step is to aim for simplicity in your names. It might take a few iterations to come up with something that works, but simple names are often the best. When naming functions, for instance, use verbs to describe what they do, and for objects, use nouns.

In JavaScript, I generally use singular nouns for classes or objects. For example:

const friend = new Person("John", "Smith");

Notice how I used the variable name friend rather than something generic like p1 or obj. It’s tempting to use short, vague names like i, x, or y, but more descriptive names like index, counter, or friend improve code readability.

3. Make Your Code Readable

I like to write JavaScript code in a way that it can be easily read aloud and understood. For example:

const userChoice = prompt("Enter a or b:");
if (userChoice === "a") {
  console.log("Thanks for choosing 'a'");
}

By naming variables meaningfully, I can “read” my code out loud: "If user choice equals 'a'..." It makes sense in both writing and speech, which is helpful for communicating with colleagues or when explaining code in meetings or tutorials.

4. Use Meaningful Boolean Names

When working with boolean values, I often use names that describe the condition clearly, such as isLoggedIn, isAvailable, or hasAccess. This way, the code becomes more intuitive:

if (user.isLoggedIn) {
  performAction();
}

The naming convention helps the code flow better and makes it easier to reason about.

5. Prefer Long, Descriptive Names

I’m also a fan of long variable names. I’d much rather use dailyRainfall instead of just d or rain. Yes, it means more typing, but the clarity it provides is worth it in the long run. The code becomes self-explanatory, which reduces the need for excessive comments or documentation.

6. Avoid Outdated Naming Conventions

Some naming conventions, like Hungarian notation (where the variable type is embedded in the name, such as lCounter for a long integer), have fallen out of favor in modern JavaScript. Today, the flexibility of JavaScript allows for cleaner, more readable names without needing to encode type information directly into the variable name.

7. Refactor Names for Better Maintenance

Finally, whenever you’re maintaining existing code, pay attention to the names of functions, variables, and parameters. If something is unclear at first glance, think about what changes would make the code more understandable. Often, renaming a few key variables or functions can dramatically improve the code's readability.

Over time, you’ll develop your own style and instincts for naming things, but always prioritize clarity and simplicity. This will make your code easier for others (and your future self) to read and maintain.