Шаблонные литералы в JavaScript (ES6)

В ES6 строковые литералы разрешены для встроенных выражений. он добавляет параметры многострочных строк и интерполяции строк для программистов на JavaScript.

Литералы шаблона должны быть заключены в символ обратной галочки (``) вместо двойных или одинарных кавычек.

Двигатель: -

Интерполяция строк: -

• Процесс подстановки переменных, вычисление выражений.

function postGreeting(fullname,address){
     let currentDate = new Date();
     let currentHour = currentDate.getHours();
     let message = currentDate<12?”Good Morning”:currentDate<17?”Good Afternoon”:”Good Evening”;
     console.log(‘${message}! ${fullname}, ${address}. Welcome to Template Literals.’);
     
// output:- ${message}! ${fullname}, ${address}. Welcome to Template
        // Literals.
     console.log(“${message}! ${fullname}, ${address}. Welcome to Template Literals.”);
     
// output:- ${message}! ${fullname}, ${address}. Welcome to Template
        // Literals.
     console.log(`${message}! ${fullname}, ${address}. Welcome to Template Literals.`);
     
// output:- Good Evening! James Bond, Bangalore. Welcome to Template
        // Literals.
    }
    postGreeting(“James Bond”,”Bangalore”);

В приведенном выше примере строковые литералы с двойными и одинарными кавычками не заменяют имена переменных JavaScript их значением, только обратный тик заменяет имена переменных на их значение.

Выражения: -

• Литералы шаблона также будут оценивать выражения.

console.log(`Hello,${new Date().getHours()<12?"Good Morning":new Date().getHours()<17?"Good Afternoon":"Good Evening"}.`);
    
// output:- Hello,Good Evening.

Тегированные литералы шаблона: -

• Передача литерала шаблона в функцию.
• Он анализирует строковый литерал и значения.
• Первым аргументом всегда будет массив строк из переданного литерала шаблона.
• После первых аргументов все остальные относятся к значению выражений. это может быть оператор распространения (…), который будет массивом значений выражений.

function postGreeting(template,arg){
        console.log(template);
            
// output:- (2) ["Hello, ", ".", raw: Array(2)]
        console.log(arg);
           
 // output:- 20
        return `${template[0]}${arg<12?"Good Morning":arg<17?"Good Afternoon":"Good Evening"}${template[1]}`;
    }
    console.log(postGreeting`Hello, ${new Date().getHours()}.`);
    
// output:- Hello, Good Evening.

Необработанная строка: -

• Он добавляется для получения строк без обработки управляющих последовательностей.

String.raw`Addtion of 1 plus 2 is \n ${1+2}`;
   
output:- "Addtion of 1 plus 2 is \n 3"
`Addtion of 1 plus 2 is \n ${1+2}`;
   
output:- "Addtion of 1 plus 2 is 
             3"

Шаблонные литералы упрощают процесс строковых манипуляций, таких как подстановка, замена, конкатенация.

Ссылки: -