
- Javascript Basics Tutorial
- Javascript - Home
- Javascript - Overview
- Javascript - Syntax
- Javascript - Enabling
- Javascript - Placement
- Javascript - Variables
- Javascript - Operators
- Javascript - If...Else
- Javascript - Switch Case
- Javascript - While Loop
- Javascript - For Loop
- Javascript - For...in
- Javascript - Loop Control
- Javascript - Functions
- Javascript - Events
- Javascript - Cookies
- Javascript - Page Redirect
- Javascript - Dialog Boxes
- Javascript - Void Keyword
- Javascript - Page Printing
- JavaScript Objects
- Javascript - Objects
- Javascript - Number
- Javascript - Boolean
- Javascript - Strings
- Javascript - Arrays
- Javascript - Date
- Javascript - Math
- Javascript - RegExp
- Javascript - HTML DOM
- JavaScript Advanced
- Javascript - Error Handling
- Javascript - Validations
- Javascript - Animation
- Javascript - Multimedia
- Javascript - Debugging
- Javascript - Image Map
- Javascript - Browsers
- JavaScript Useful Resources
- Javascript - Questions And Answers
- Javascript - Quick Guide
- Javascript - Functions
- Javascript - Resources
How to do string interpolation in JavaScript?
String interpolation in JavaScript is a process in which an expression is inserted or placed in the string. To insert or embed this expression into the string a template literal is used. By using string interpolation in JavaScript, values like variables and mathematical expressions and calculations can also be added.
The template literal has a dollar sign followed by curly brackets. Inside the curly brackets of this template literal, the expression or the mathematical calculation which is to evaluated and embedded should be written.
Syntax
The syntax of the string interpolation in JavaScript is as follows.
`string where interpolation should be done enclosed in backticks: expression`
In JavaScript by using string interpolation inputs can be inserted into the parts of the strings dynamically by using the placeholders. The traditional approach of inserting variables into the strings doesn’t support the possibility of the inserting the inputs dynamically.
Example 1
This example demonstrates how to use a template literal to interpolate a string in JavaScript.
const name="Abdul Rawoof" const company = "Tutorials Point" let salary = 18000 let increment = 2000 let mail = 'abdul@gmail.com' console.log(`Employee name is ${name} and the company is ${company} Salary of ${name} after increment is ${increment}:${salary+increment} Contact details of ${name} is ${mail}`)
The traditional code for the example 1 will be as,
const name="Abdul Rawoof" const company = "Tutorials Point" let salary = 18000 let increment = 2000 let mail = 'abdul@gmail.com' console.log("Employee name is" +name + "and the company is" +company) console.log("Salary of "+ name + "after increment "+ increment +" is "+(salary+increment)) console.log("Contact details of "+ name + "is "+mail)
The above code is the traditional way in which the number of lines is more when compared with the example 1 code. The console command has to be written for 3 times in the traditional way but when the backticks are used and the placeholders are used it is written in only one console. This decreases the code complexity and also the dynamic inputs can be used.
Merging strings, making mathematical calculations, using ternary operators etc., can be performed by using string interpolations.
Example 2
This example demonstrates some of the operations which can be done by string interpolations in JavaScript.
const name1="Abdul" const name2="Rawoof" name = `${name1+name2}` const company = "Tutorials Point" let salary = 18000 let increment = 2000 let mail = 'abdul@gmail.com' let experience = 3 console.log("String Concate: Full name is",`${name1 + name2}`) console.log("String Interpolation",`Employee name is ${name} and the company is ${company}`) console.log("Using Ternary Operator",`Salary if increment is done based on experience ${experience > 2 ? 20000 : 18000}`)
- Related Articles
- String Interpolation in Dart Programming
- Interpolation Search in JavaScript
- Java Program to Illustrate String Interpolation
- Golang program to demonstrate the string interpolation
- Python Program to demonstrate the string interpolation
- How to do case-sensitive string comparison in JavaScript?
- How to do case insensitive string comparison of strings in JavaScript
- How do I compare String and Boolean in JavaScript?
- How do you reverse a string in place in JavaScript?
- How do you convert a string to a character array in JavaScript?
- How do I convert a string into an integer in JavaScript?
- Bessel’s Interpolation in C++
- Lagrange’s Interpolation in C++
- How to do reverse of string in Android?
- Interpolation Search
