Rules for naming variables in JavaScript
Ashwani Singh
Posted on March 12, 2024
1. Rules for naming variables
Almost all programming languages enforce certain rules on the programmer when naming variables. This is done to prevent one from creating names that could introduce ambiguity into the respective program.
The rules we must follow when naming variables in JavaScript are as follows:
- Names can only contain alphanumeric characters (a-z, A-Z, 0-9) and the _ (underscore) and $ (dollar sign) characters; nothing else. Hence, first-name is invalid since it contains a hyphen (-) which is illegal to put in a variable name.
- Names can't begin with a digit. Hence, 2nd is invalid.
- Names can't contain spaces. Hence, first word is invalid.
- Names can't be reserved keywords. Hence, var is invalid.
2. Tips for naming variables
In this section, we aim to discuss a handful of tips to consider when naming variables in JavaScript, including which casing convention to use in order to break long words.
2.1 Be descriptive
A variable's name shall clearly describe what it's meant to hold.
Suppose that you have to store a user's name in a variable. It would be really bad if you name the variable a (or x or u for 'user', or any random character). The name a doesn't tell much about what's stored in the variable.
A much better name would be username, or uname.
2.2 Don't be overly descriptive
Suppose we want to create a variable that stores the first name of a user. Being exceptionally descriptive, we could name it thefirstnameofuser, although this would be more than the required amount of description.
A better name would be firstname.
3.3 Abbreviate long words
Sometimes, it's really helpful to abbreviate long words in a given name to short and simple words, given that the abbreviation seems sensible.
For example, the variable dbname could work well instead of databasename. Here, we've abbreviated 'database' to 'db'.
But keep in mind that abbreviations don't always work well.
For instance, naming a variable that holds the name of an object's property as pname would be a complete mess. pname could mean 'property name' or 'panel name' or 'previous name'.
A much better name would be propname — with the word 'property' abbreviated down to 'prop'.
2.4 Use a casing convention to break words
When a variable's name contains more than one word, it's desirable to use some casing convention to be able to distinguish between them easily while reading the variable.
camelCasing: every word's first letter is uppercased except for that of the first word. Camel casing is the casing used in JavaScript. Here are some identifier names from JavaScript: indexOf, getElementById, querySelectorAll.
PascalCasing: every word's first character is uppercased. C# uses Pascal casing for almost all identifiers. Some examples from C# are as follows: WriteLine, ReadLine, GetType.
snake_casing: every word is lowercased and separated from the other using the _ (underscore) character. PHP uses snake casing for most of its predefined functions. Some examples from PHP are as follows: array_push, mysqli_connect, str_split.
SCREAMING_SNAKE_CASING: every word is uppercased and separated from the other using the _ (underscore) character. This casing is commonly used to denote constants in many programming languages, including JavaScript. Some examples are: MAX_VALUE, MAX_SAFE_INTEGER.
questionsAsked in camel casing.
QuestionsAsked in Pascal casing.
questions_asked in snake casing.
QUESTIONS_ASKED in screaming snake casing.
3. Which casing convention to use in JavaScript?
The two most common conventions used for naming variables in most of the programming languages out there are camel casing and snake casing.
The question of 'which convention to use in JavaScript' really boils down to the question of 'whether to use camel casing or snake casing in JavaScript'.
Honestly speaking, this is solely a matter of preference. If you like camel casing, go with it. Similarly, if snake casing appeals you, go with it. Whatever you choose, make sure to stick with it — consistency is a must!
In this course, we'll use the camel casing convention to name variables. The reason is extremely simply — it's the convention used throughout JavaScript for function and method names.
Posted on March 12, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.