The name of the variable should be chosen as carefully as a name for a child
Well-written code should read like a book, and I'll say more, well-written code does not require comments. Just like in a book, we have footnotes, so we should comment our code, very rarely. Keeping this analogy, our variables should be like headers in this book. After reading such a header, we don't even have to delve into its content. Similarly, with variable names, after seeing a variable getNumberOfProducts
, a vision of a method or function that will return the number of products to us immediately appears in our head, probably the context in which we are located. On the other hand, when our variable looks like this getProducts
and does the same thing, it confuses the programmer, as everyone would expect an array of products. I always say that accuracy is the most important thing in coding! Below I will try to give you an insight into some rules that you should follow when choosing names for your variables.
Clearly define your intentions
What do you really want? Why do you need this variable? Why does it exist? What does it do? How is it used?
Wrong
const deleteDays; //days since deletion
Right
const daysSinceDelete; //days since deletion
The variable deleteDays
does not clearly tell us which days it is referring to, leaves room for incorrect interpretation, and poorly reflects intentions. Additionally, if we use the variable daysSinceDelete
, it must store a value in days and not in seconds, as this would be inadequate for the variable name.
Inform Correctly
When you use shortcuts, make sure that the shortcut is common and every programmer will read it correctly.
Wrong
const sliderImagesTab; //slider images array
Correct
const sliderImagesArr; //slider images array
sliderImagesTab
uses an incorrect shorthand for an array in programming languages. Of course, the Arr
suffix could be omitted, as just sliderImages
should refer to an array. I will write more, if the context allows us we could use just the name images
.
Do not create variable names that do not significantly differ, however, if you really need it and you are sure that there is no better way, put the difference at the end of the name.
Wrong
const getAttributeNameFromActiveImage; //Attribute name of the active image
const getAttributeAltFromActiveImage; //Attribute alt of the active image
Better
const getFromActiveImageAttributeName; //Attribute name of the active image
const getFromActiveImageAttributeAlt; //Attribute alt of the active image
Correct
const activeImage.getAttributeName; //Attribute name of the active image
const activeImage.getAttributeAlt; //Attribute alt of the active image
Of course, these variables are functions, and their name is not satisfying. It was used to show how we can confuse the readability of the code by using variables that are too visually similar to each other.
Beware of prohibited words
Avoid naming variables with semantic parts. Some words are reserved for certain programming entities, for example the word class
does not mean group or category. It refers to a specific element of programming.
Wrong
const humanClass; //Human social class
Right
const humanSocialStatus; //Human social class
Similarly with words such as function, array, string
etc. You may mislead a programmer who assumes that you mean a completely different context for the name. Additionally, remember that some languages have their own naming conventions, for example in JS, classes are named using a capital first letter, which in turn means that there is no need to name a variable ProductClass
, simply Product
is enough.
Variables like to look good
For reading code, you use your eyes, and your eyes can play tricks. The famous example with the small letter "L" and the number "1". And with a capital letter O and zero.
Wrong
const lO; //A variable consisting of the characters L and O
Additionally, do not mix the adopted variable naming convention:
Wrong
const get_FirstLetter; //Get the first letter
Right
const getFirstLetter; //Get the first letter
Many experienced programmers are angry about the naming system in BEM CSS. Specifically, it refers to the use of the characters "--" and "__". In my opinion, this stems from the need for pedantic maintenance of code, indentation, spaces, shortening, etc. This is my anecdotal proof that a variable likes to look good.
The context of the variable name must be different
The name of the variable cannot be confused with another similar name.
Wrong
const getImages;
const getImage;
const getPictures;
Right
const getSliderImages;
const getActiveImageOfSlider;
const getThumbnails;
The first three variables may indicate exactly the same function, if you have already created a variable and you have to rebuild the whole program because you need a similar name, do it!
Names must be easy
Use variable names that can be discussed at meetings, remember that your variable is a condensed description of its content. What describes the variable a110222product
, I already translate it is a product created on the eleventh of February. Try talking to a programmer about such code though.
Wrong
const a110222product; //Product with the date embedded in the name
Right
const product.createDate; //Product with the date given as a property
You will be searching for a variable several times
A good name should be unique and easy to search for. Think that you named a variable with one letter, for example a
think about how much time it will take you to find this variable in code that counts 1000 lines.
Wrong
const pro; //Variable storing the product object locally
Right
const product //Variable storing the product object locally
Exceptions are variables that you will never search for, such as the example i
in the for
loop.
Don't be afraid of length
The variable name should be exhaustive and understandable, don't save words, save on a better name.
Wrong
const galleryThumbnailsShowOrHideButton; //Too long, it can be simpler
Good
const galleryThumbnailsToggleButton; //Long and good
Code with appropriate names is longer but also better.
Unnecessary prefixes and suffixes
All unnecessary additions to variables like "info", "var", "private", "class" etc.
Wrong
const varProductInfo; //There is no need to inform that it's a variable, and what information does the word info give us?
Good
const product; //This name tells us exactly the same as the previous one
Modesty
Every programmer understands that he is the God of the world, that it should be an elite profession without seasonal wordpressers, but don't try too hard. Don't show off how much of a badass you are if the loop name has become a tradition and don't change it to index. One, it's already tradition, two, what if you need a loop in a loop? Oh, right, you can always name it jndex.
Classes
Class names should be nouns or combinations of nouns and adjectives.
Good
const Tree; //Noun
const BigTree; //Adjective + noun
const TreeOak; //Noun + noun
Methods
Method names should be verbs combined with nouns or nouns and adjectives. Mutators and predicates should have names based on the property they handle and be preceded by the prefix get, set, or is.
Good
const getTreeHeight; //Verb + noun + noun
const setBigTree; //Verb + adjective + noun
const delete; //Verb
Stick to Nomenclature
Always describe the abstractions, class, or object you're in with the same word. For example, when creating a slider, don't call it a slider one time and a rotator another. It's easy to get confused when you have two methods in your code, such as getImages or getPictures. What's the difference between them?
We Must Stick Together
The guy who is reading your code is also a programmer, help him out by using a name related to our industry, for example, buttonFactory and it's already clear that the factory pattern has been used. You can check if it's used correctly or not.
Summary
I managed to gather a few simple rules, and I will probably add new ones as I put my article to the mercy of mean programmers. And what rules do you follow when naming variables?