JavaScript Dollar Sign ($) and Underscore (_) Explained

By /

In JavaScript, the dollar sign ($) and underscore (_) are both identifiers—similar to any other name, like myCar or houseAge.

You can use a dollar sign or underscore to identify objects, such as:

  • Variables
  • Functions
  • Properties
  • Events
  • Objects

Thus, the dollar sign and underscore are not treated like other special symbols (such as the dot) in JavaScript.

The dollar sign is also part of a template literal and allows you to embed code inside a string.

let age = 10
let hello = `Hello, I am ${age} years old.`

This comprehensive guide teaches you how the dollar sign and underscore are typically used in JavaScript.

JavaScript Identifier Rules

To name objects in JavaScript, you can use identifiers.

This is something you probably learned during the first hours of learning JavaScript.

let myName = "Jack"
let age = 100

Naming the identifiers in JavaScript follows these simple rules.

An identifier must start with one of these:

  • A lower case letter (a-z)
  • Upper case letter (A-Z)
  • Underscore (_)
  • Dollar sign ($)

Besides, the subsequent characters can include

  • Digits (0-9)
  • Lower case letters (a-z)
  • Upper case letters (A-Z)
  • Underscores (_)
  • Dollar signs ($)

For example, this is an example of a valid identifier in JavaScript:

let _myAge2022$ = 26

Now that you understand all the naming rules of identifiers in JavaScript, let’s center the focus on the dollar signs and underscores.

The Dollar Sign ($)

As you learned, there is no particular interest in the dollar sign or underscores in JavaScript.

Even though the dollar sign and underscore are identifiers like any other character, there are some practical use cases for them.

The Dollar Shorthand

When using JavaScript, you typically encounter some functions that you must use frequently yet calling them looks rather verbose.

One example is the document.getElementById() function.

document.getElementById("age")

This function call takes time to write and is pretty verbose. Thus, a common convention is to replace the document.getElementById() function with $().

Notice that this has nothing to do with JavaScript language. Instead, your typical framework, such as JQuery specifies this function as a DOM selector.

So somewhere behind the scenes in the framework, it says:

function $(x) {
    return document.getElementById(x)
}

This allows you to access the DOM elements with a convenient call, such as:

$("my-div")

Instead of:

document.getElementById("my-div")

But why use the dollar sign? Why not a regular letter, such as “f”?

This is because the dollar sign (and underscore) are short one-character words that are most likely not being used elsewhere in the code. This improves the code quality while avoiding collisions with other parts of the code.

This is an example of the conventional use of the dollar sign.

Next, let’s take look at embedding variables to strings using template literals. This is an example where the dollar sign is part of a larger expression.

Dollar Sign in Template Literals

To add code, such as variables or function calls inside a string, you can use template literals. These are a relatively new addition to JavaScript, as of ES6.

Here is an example of a template literal:

let age = 10
let text = `Hello, I am ${age} years old.`

Here the age is embedded inside the text string.

A template literal allows you to add code or variables inside strings. A template literal is like a string, but it starts with backticks (`) instead of quotation marks (” or ‘).

To add code inside a template literal string, use the dollar sign followed by curly brackets (${}) and place the code inside the curly brackets.

Adding code inside a string is the one and only example in JavaScript where you actually need the dollar sign to make something work.

Now that you’ve seen examples of the dollar sign in JavaScript, let’s take a look at the underscore.

The Underscore (_)

Similar to the dollar sign, the underscore is merely used for convenience.

Remember, the underscore is just a letter in the alphabet.

You can use it as an identifier similar to any other character.

But thanks to the uniqueness of the underscore, JavaScript developers have developed a convention for it. Typically, a leading underscore denotes a property or method that is private.

For example:

function _calculate(x, y) {
    ....
}

With this convention, you can tell the method is private right away. Thanks to the popularity of this convention, almost every developer will understand what it means.

This is handy because some versions of JavaScript don’t use the keywords private or public.

Wrap Up

Today you learned how the dollar sign ($) ad underscore (_) work in JavaScript.

To recap, the dollar sign and the underscore are identifiers. Thus, there is nothing special about these.

But due to the unique look of these letters, they are used for convenience:

  1. The “dollar sign function” $() is typically used to override the lengthy DOM function document.getElementById().
  2. The underscore is used to denote the access level of properties. To do this, place a leading underscore to the name of the property.

The dollar sign is also a part of the template literal where you want to insert code into a string.

Scroll to Top