In JavaScript, literals are a way to represent values in a program. Let’s take a look at a scenario where you need to use some code that provides the same functionality everywhere in a program like a template.

Here JavaScript literals come into the picture which provides the user with predefined functionalities when they use it.

This article is a complete guide and occupied with the detailed knowledge about

• What are JavaScript literals
• Types of JavaScript literals
• Template Literals
• Object Literals
• String Literals
• Numeric Literals
• Boolean Literals
• Floating-Point Literals
• Regular expression Literals

What are JavaScript Literals

JavaScript Literals are the fixed values that are used to represent data in a program. These literals are used to represent data like integer, string, boolean, and array. We do not need any specific keyword to write these literals.

Types Of JavaScript Literals

Following are the types of literals that are supported by JavaScript:

• Array Literals
• Boolean Literals
• Floating-point Literals
• Numeric Literals
• Object Literals
• Regular Expression Literals
• String Literals
• Template Literals

Array Literals

A collection of elements wrapped between the pair of square brackets [ ] represent an array literal in JavaScript. These literals are initialized by the specific values added between square brackets. The size of the array literal is specified by the number of elements between square brackets.  Array literal may contain zero or more elements according to the programmer’s requirement.

Code

Here we create three array literals.

Output

In the above example, we create three arrays fruit1, fruit2, and fruit3 using an array literal.

We add no elements in the first array which is considered as an array in JavaScript but with no element.

In the second array, we add three elements that initialize the array as string type due to the elements in it, and its size is specified as 3 because of the number of elements in it as shown in the above output.

In the third array, we also add three elements but put an extra comma between the elements due to which the compiler considers the length of the array to be 4 but with one empty index as shown in the above output.

Note: If we put a comma at the start of the elements or between the elements, the compiler considers it as an index but if we put a comma at the end of the elements, the compiler ignores it completely.

Boolean Literals

In JavaScript boolean literal works with comparison operators like <, >, <=, >=, ==, != etc. The functionality of these literals is predefined as these literals only return true or false.

Code

Here we take two variables, check and comp and compare different values in both variables which will return only true or false as an output because both variables are using boolean literal.

Output

As in the above output it is clearly shown that the check variable returns a false value and the comp variable returns a true value as they both used boolean literals.

Floating-point Literals

These literals represent the values with a decimal point. Floating-point literals can be a decimal point number, a decimal point integer, or an exponent.

Code

Here we take three variables dec, fra and exp. Then assign a positive decimal point value to dec, negative decimal point value to fra, and exponent value to exp.

Output

The above output clearly shows that the dec variable prints a positive decimal point value. The decimal point value is always positive.

The fra variable print decimal point integer value which means floating-point literal can be a positive or negative number with a decimal point.

The exp variable print exponent of a number which means floating-point literal can be used to represent an exponent of a number.

Numeric Literals

Numeric literals are basically the series of digits/numbers. Numeric literals can be represented in:

Base 10: decimal (which contains digits from 0 to 9)

Base 8: octal (which contains digits from 0 to 7)

Base 16:  hexadecimal (which contains digits from 0 to 9 and the letters from A/a to F/f)

Code

Here we take three variables dec, oct and hex, then we assign a decimal value to dec, octal to oct, and hexadecimal value hex.

Output

In the above output it is clearly seen that the dec variable prints the decimal number. The oct variable takes an octal number and prints the value after converting it into a decimal number. The hex variable takes a hexadecimal number and prints the value after converting it into a decimal number.

Object Literals

Object literal is basically a list of 0 or more pairs of property names and associated values of an object wrapped inside a pair of { } curly brackets.

Code

Here we create a variable info and assign a list with name, roll number and marks to it. Then we access names and marks from the list with help of a (.) and print the result.

Output

As above, the output shows that we get the expected output with the help of object literal.

Regular Expression Literals

Regular expression literals are mainly used to quickly search long information in long strings. These literals are used with forward slashes (//). The word that is to be searched in a string wrote between forward slashes as shown below

Code

Here we take three variables str, str2, and search. Then we assign a string to str, str2 is assigned with regular expression literal, and search is assigned with a JavaScript match() function and gives str2 as a parameter. Lastly, we display the result.

Output

Above output clearly shows that we search (from) word from the given string with the help of regular expression literal and it displays the word that is searched, the index number where that word is placed, and the string from which that word is searched.

String Literals

A string literal is basically a string made up of characters between (“”) double or (‘’) single quotation marks.

Following are the special characters used in JavaScript string literals.

Code

Here we take two strings. The first one is represented with double quotes string literal and \n special character, the second one is represented with single quotes string literal and \t special character.

Output 

Above output clearly shows that both string literals, double and single quote print strings but \n starts a new line while \t adds a tab in a string.

Template Literals

String and variables combined together between the pair of backticks (“) are defined as template literals. These literals are used to combine strings and variables without making the code messy. String interpolation is also performed using template literals.

Code

Here we take a variable a and str, then we assign 5 to variable a and use template literal on variable str. Then we simply display the str variable.

Output

Above output clearly shows that we get the required output using template literals.

Conclusion

JavaScript literals are the fixed values that are assigned to variables to represent different data. This article explains the types of JavaScript literals, like an array, string, floating-point, object, template, and numeric literals in detail.