Skip to content

Instantly share code, notes, and snippets.

@dherman
Last active July 4, 2021 10:41
Show Gist options
  • Select an option

  • Save dherman/6165867 to your computer and use it in GitHub Desktop.

Select an option

Save dherman/6165867 to your computer and use it in GitHub Desktop.
What can you do with ES6 string template literals?

DOM selectors

var elements = query`.${className}`;

Localization

var message = l10n`Hello ${name}; you are visitor number ${visitor}:n!
You have ${money}:c in your account!`;

Customizable regexps

var match = input.match(re`\d+${separator}\d+`);

Multiline regexps

var parts = str.match(regex`
    ^                    # match at start of string only
    / (?<year> [^/]+ )   # capture top dir name as year
    / (?<month> [^/]+ )  # capture subdir name as month
    / (?<title> [^/]+ )  # capture file name without ext as title
    \.html? $            # .htm or .html file ext at end of path
`);

See also: https://gist.github.com/slevithan/4222600

Embedded HTML

html`<a href="${url}">${text}</a>`

Shell commands

var proc = sh`ps ax | grep ${pid}`;

Byte strings

var buffer = bytes`455336465457210a`;
@rauschma
Copy link
Copy Markdown

rauschma commented Aug 7, 2013

For some of these examples, it may make sense to briefly explain why they are cool and how they would work.

@maxhoffmann
Copy link
Copy Markdown

Yes an explanation would be great.

I guess this would not work. ;)

let serverCrash = sh`rm -R /`;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment