JavaScript

10Templates, Tag Functions, and New String Features

WHAT'S IN THIS CHAPTER?

• Template literals
• Template tag functions
• Improved Unicode support in strings
• String iteration
• New string methods
• Updates to match, split, search, and replace

WROX.COM CODE DOWNLOADS FOR THIS CHAPTER

You can download the code for this chapter at https://thenewtoys.dev/bookcode or https://www.wiley.com/go/javascript-newtoys.

In this chapter, you'll learn about ES2015's new template literals and template tag functions, plus new string features such as improved Unicode support, iteration, and added methods.

TEMPLATE LITERALS

ES2015's template literals provide a way to create strings (and other things) using a literal syntax combining text and embedded substitutions. You're familiar with other kinds of literals, such as string literals delimited with quotes ( "hi") and regular expression literals delimited with slashes (/\s/). Template literals are delimited with backticks ( `), also called grave accents. This character is in various places on various different language keyboard layouts; on English-language keyboards it tends to be in the top left near Esc, but again, the location varies.

Template literals come in two varieties: untagged and tagged. We'll look at untagged (standalone) template literals first, then tagged literals.

Basic Functionality (Untagged Template Literals)

An untagged template literal creates a string. Here's a simple example:

console.log(`This is a template literal`); ...