String Formatting in JavaScript

We will understand string formatting in JavaScript in this article. Let us first understand the JavaScript string.

JavaScript string

The JavaScript string is the series of characters that are kept inside single or double quotes. The string's first character is indexed at 0 and the second character is indexed at 1 and so on.

String formatting

The key concept of string formatting is to insert variables inside a string. The inserted variables are known as placeholders.

There are many methods which are utilized to format a string:

• ${} within backticks
• Concatenation
• String interpolation
• Custom function

We will understand each method with the help of demonstrations.

Utilizing ${} within Backticks

We will use the ${} within backticks to format a string. The backtick is represented as ( ` ` ).

Demo 1:

We will declare two strings named subject1 and subject2. After that, we will put the values to these strings. We will utilize ` ` and ${} to format and print a string.

Code:

Output:

 Learn Core Java and Advanced Java from Javatpoint. 

Demo 2:

We will declare two strings named mathsMarks and englishMarks. After that, we will add the strings and put the value to the string total. We will utilize ` `, ${} and ternary operator to format a string.

Code:

Output:

 Your total marks are 205. Congrats! You are eligible to get admission to the school. You are not a student. 

Demo 3:

We will declare a string named student and give it a Boolean value as false. After that, we will format a string according to the condition.

Code:

Output:

 You are not a student. 

Utilizing concatenation (+ operator)

We will use the concatenation to format a string. The concatenation is utilized to combine two or more strings.

Demo 1:

We will declare three strings named s1, s2 and s3 then store the values. We will utilize the concatenation operator to join the two strings and give it to a new string.

Code:

Output:

 Welcome to JTP! 

Demo 2:

We will utilize the concatenation operator with the ternary operator to format a string. We will declare a string named age and store the value then we will print a new string.

Code:

Output:

 You are not eligible to vote this time. 

Demo 3:

We will declare two strings named number1 and number2. After that, we will store the difference between these strings in a string named difference. We will then print the formatted string.

Code:

Output:

 The difference between 45 and 20 is 25 

Utilizing String interpolation

We will use the string interpolation to format a string. This method is utilized to inject variables, arithmetic expressions and function calls into a string.

Demo 1:

We will declare four strings named firstName, lastName, studentName and message. We will declare another string formatted_message and provide it the value of replaced message.

Code:

Output:

 Welcome Ajeet Kumar, submit your assignment. 

Demo 2:

We will declare two strings named employeeName and message. We will declare another string formatted_message and provide it the value of replaced message.

Code:

Output:

 Hello Anjali, show your work. 

Utilizing custom function

We will use the custom function to format a string.

Demo:

We will create a custom function and print the formatted string.

Code:

Output:

 Congratulations, Shrishti from Chandigarh University! Welcome to Javatpoint. 

Conclusion:

We have gained a comprehensive understanding of string formatting in JavaScript in this article. We have understood various methods with the help of demonstrations and now we are equipped with the knowledge to apply these techniques in future projects.