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 (s

Solution 1:

The tag function func is passed just one array. That array comes from the _taggedTemplateLiteral function, which takes the incoming "strings" parameter and adds a single property to it.

The function func would be declared like this (ES5-style):

functionfunc(strings) {
  var params = [].slice.call(arguments, 1);
  // do stuff
}

If, inside func, the code needed to use the "raw" strings, it would just access the .raw property of the "strings" variable:

functionfunc(strings) {
  var params = [].slice.call(arguments, 1);

  var raw2 = strings.raw[2];

  // do stuff
}

So the "user" — the author of the tag function — does have control. Code in the tag function is free to examine the original content of the template parts whenever it wants. It's probably the case that tag functions that essentially implement a DSL might want to only use the raw strings, while simpler template mechanisms won't care and will be happy to use the "parsed" strings.