Questions tagged [tagged-templates]
37 questions
147
votes
3 answers
Backticks (`…`) calling a function in JavaScript
I'm not sure how to explain this, but when I run
console.log`1`
In google chrome, I get output like
console.log`1`
VM12380:2 ["1", raw: Array[1]]
Why is the backtick calling the log function, and why is it making a index of raw:…
Sterling Archer
- 22,070
- 18
- 81
- 118
13
votes
3 answers
ES6 tagged templates practical usability
I understand the syntax of ES6 tagged templates. What I don't see is the practical usability. When is it better than passing an object parameter, like the settings in jQuery's AJAX? $.ajax('url', { /*this guy here*/ })
Right now I only see the…
Gábor Imre
- 5,899
- 2
- 35
- 48
8
votes
2 answers
javascript console.log new feature with 'raw'?
I have encounter this example and was completely lost...
const test = (hey) => console.log(hey);
console.log(test `wtf`);
First all this is valid, in the console.log, it appear to be
["wtf", raw: Array[1]]
It's like the function is been executed…
Bill
- 17,872
- 19
- 83
- 131
7
votes
1 answer
ES6 calling function with template literal but no parentheses
According to MDN, Tagged template literals can be used as follows:
var a = 5;
var b = 10;
function tag(strings, ...values) {
alert(strings[0]); // "Hello "
alert(strings[1]); // " world "
alert(values[0]); // 15
alert(values[1]); //…
aWebDeveloper
- 36,687
- 39
- 170
- 242
6
votes
1 answer
Trying to use Tagged template strings gives 'Uncaught SyntaxError: Unexpected token'
I'm using tagged template strings in following code
var a = 5;
var b = 10;
var pp="";
function tag(strings, ...values) {
pp+=strings[0]; // "Hello "
pp+=strings[1]; // " world "
pp+=values[0]; // 15
pp+=values[1]; // 50
…
Akhilesh Kumar
- 9,085
- 13
- 57
- 95
5
votes
1 answer
Template literals and parentheses-less function calls
I recently learned that ES6 allows to make function calls without parentheses when using a template literal as a parameter. E.g.
showstring`Hello World`;
After reading a few articles on this functionality, however, I have come away with scant…
codemonkey
- 7,325
- 5
- 22
- 36
5
votes
1 answer
Javascript Es6 Tagged Templates - When is raw used? When is cooked used?
After studying this Es6 tag template example:
var yo = func`${x} + ${y}\n= ${x + y}`;
one@public-node ~/es6 $ 6to5 tag.js
"use strict";
var _taggedTemplateLiteral = function (strings, raw) {
return…
dman
- 10,406
- 18
- 102
- 201
4
votes
3 answers
Tag for generic template literal function in javascript
My goal is to write a tagged template function like
myTemplateTagFunction`some text ${variable} etc. etc.`
...that behaves like the default template literal function in javascript.
My first attempt was
let myTaggedTemplate = args => `${args}`
But…
rob-gordon
- 1,419
- 3
- 20
- 38
4
votes
2 answers
How to detect whether a function was called normally or as a tagged template literal?
I'd like to create a function that can be called normally:
myFn(arg1, arg2)
Or as a tagged template literal:
myFn`text ${someVar}`
In the implementation of myFn, is it possible to detect whether it was called normally or as a tagged template…
maxedison
- 17,243
- 14
- 67
- 114
4
votes
1 answer
Array Argument not Extensible in Tag Function
Typically, arrays in javascript are extensible, but this is not true for the array passed as the first argument of a tag function:
let ary = [1,2,3];
console.log(Object.isExtensible(ary));
// returns true
function tag(ary,…
Lonnie Best
- 9,936
- 10
- 57
- 97
4
votes
2 answers
Are TemplateObject arrays for tagged template literals weakly referenced by their realm?
while (c) {
tag`str0 ${e} str1`
}
The JavaScript runtime creates a frozen array like Object.freeze(['str0 ', ' str1']) but with an additional .raw property.
Is it okay to use that object as a key in a WeakMap to avoid having to redo work based on…
Mike Samuel
- 118,113
- 30
- 216
- 245
4
votes
1 answer
How to interpolate a tagged template string with a dynamic value?
I would like to interpolate a template string (defined elsewhere):
const url = `www.example.com/${query}/current.json`;
with a dynamic value (for example, "es6") into this:
"www.example.com/es6/current.json"
For example, if i had something like…
zok
- 6,065
- 10
- 43
- 65
2
votes
1 answer
How to get a random object from an array of objects and display in a tagged template literal?
I am using a tagged template literal to output an array of objects, but I want to display a random object, and not all the objects.
How do I display a random object from the array of objects?
const archetypes = [
{
type: 'The Magician',
…
Millhorn
- 2,953
- 7
- 39
- 77
2
votes
0 answers
Naming convention for tagged template functions
Tagged template functions aren't normal functions in the same way that constructor functions aren't normal functions. They should never be called apart from in a special way. Constructors, with a new, tagging functions with an interpolated string…
BanksySan
- 27,362
- 33
- 117
- 216
2
votes
1 answer
In ES2015, how do you reconstruct a tagged template literal in the correct order?
Using the example from the MDN docs on template literals, we can create custom "tag" functions.
var a = 5;
var b = 10;
function tag(strings, ...values) {
console.log(strings[0]);
console.log(strings[1]);
console.log(values[0]);
…
Chris
- 54,599
- 30
- 149
- 186