This: `The area of a circle of radius 4 is ${circle.area(4)}` is an example of ES2015 template strings. It interpolates whatever circle.area(4) represents directly into the string. If you’re curious about this or other ES2015 features, I recommend checking out Babel and playing around in the REPL. Here’s a very simple example to get you … Read more
You can use tagged templates to build APIs that are more expressive than regular function calls. For example, I’m working on a proof-of-concept library for SQL queries on JS arrays: let admins = sql`SELECT name, id FROM ${users} WHERE ${user => user.roles.indexOf(‘admin’) >= 0}` Notice it has nothing to do with String interpolation; it uses … Read more
Is there a way to programmatically construct a Template literal? No. “programmatically” and “literal” are antithetic (except you are in the realms of compilers). Template strings should better have been named interpolated string literals or so. Please do not confuse them with templates. If you want to use dynamically created strings for templates, use a … Read more
If you are using template literals only with placeholders (e.g. `Hello ${person.name}`) like in the question’s example, then the result is the same as just concatenating strings. Subjectively it looks better and is easier to read, especially for multi-line strings or strings containing both ‘ and ” since you don’t have to escape those characters … Read more
Why are template strings not allowed as literal object keys? Template strings are expressions, not literals1. You can only use string literals (and identifiers) for property names, for everything else – that is not known to be static – you need a computed property name. Is it for performance reasons? No, that’s unlikely. It’s to … Read more
In my project I’ve created something like this with ES6: String.prototype.interpolate = function(params) { const names = Object.keys(params); const vals = Object.values(params); return new Function(…names, `return \`${this}\`;`)(…vals); } const template=”Example text: ${text}”; const result = template.interpolate({ text: ‘Foo Boo’ }); console.log(result);
It is called Tagged Template in ES-6 more could be read about them Here, funny I found the link in the starred section of the very chat. But the relevant part of the code is below (you can basically create a filtered sort). function tag(strings, …values) { assert(strings[0] === ‘a’); assert(strings[1] === ‘b’); assert(values[0] === … Read more
This is a feature called template literals. They were called “template strings” in prior editions of the ECMAScript 2015 specification. Template literals are supported by Firefox 34, Chrome 41, and Edge 12 and above, but not by Internet Explorer. Examples: http://tc39wiki.calculist.org/es6/template-strings/ Official specification: ECMAScript 2015 Language Specification, 12.2.9 Template Literal Lexical Components (a bit dry) Template … Read more