ES6标签模板功能如何解释其参数顺序？ [英] How do ES6 tagged template functions interpret their argument order?

问题描述

考虑以下代码：

  function f（）{
 console.log（Array.from（arguments ））; 
} 
 
 var x = 2; 
 var y = 3; 
 f`before $ {x} $ {y} after`; 
  

f 的参数将是（< a href =http://google.github.io/traceur-compiler/demo/repl.html#function%20f()%20%7B%0A%20%20console.log(Array.from(arguments))%图3B％0A％7D％0A％0Avar％20X％20％3D％202％3B％0Avar％20Y％20％3D％203％3B％0Af％60before％20％24％7BX％7D％20％24％7BY％ 7D％20after％60％3Brel =nofollow>根据Traceur ）：

  [before ，，after]，2，3 
  

让我们想连接所有文字具有替换值的字符串。

如何以正确的顺序执行？

我需要匹配第一个数组中的split points每个参数首先是

解决方案

根据ECMAScript 6规范草案的维基，它更复杂，因为模板逃脱序列考虑：

模板

  quasiTag`literalPortion\0 $ x literalP ortion1` 
  

将desugar to

  //声明被提升到模块顶部。 
 //悬停声明中的转义序列不会根据CV（EscapeSequence）进行解码。 
 //对Object.freeze的调用使用该方法的原始定义。 
 const unguessableCallSiteId1234 = Object.freeze（{
 raw：Object.freeze（[literalPortion\\\0，literalPortion1]），
 cooked：Object.freeze（[ literalPortion\\\，literalPortion1]）
}）; 
 
 ... 
 
 //原位
 //参数中的转义序列被解码。 
 // unguessableCallSiteId1234是一个非常理想的弱点图，用于记录
 //提取元数据，自定义转义约定以及其他状态
 //可以从字面部分，所以不同于
 //来自同一个调用站点的调用。 
 quasiTag（unguessableCallSiteId1234，x）
  

EcmaScript准文字 - Desugaring

所以参数应该包含使用traceur看到的替换值，但是文字部分是一个对象而不是一个数组。 / p>

如果要实现它使用traceur编译的代码，您可以执行以下未优化示例。

  let concatenated =; 
 Array.forEach（args [0]，（e，i）=> 
 concatenated + = e +（i ）; 
  

对于真正的ECMAScript 6代码，请查看默认的准标签实现，正如bergi在评论中所建议的。

Consider the following code:

function f() {
  console.log(Array.from(arguments));
}

var x = 2;
var y = 3;
f`before ${x} ${y} after`;

The arguments for f would be (according to Traceur):

["before ", " ", " after"], 2, 3

Let's say I want to concatenate all literal strings with substitution values.
How do I do that in the correct order?

Do I need to match 'split points' in the first array with each argument after first?

解决方案

According to the wiki for the Draft ECMAScript 6 Specification, it is more complicated because templates take escape sequences into account:

The template

quasiTag`literalPortion\0 $x literalPortion1`

will desugar to

// Declaration hoisted to top of module.
// Escape sequences in the hoisted declaration are not decoded according to CV(EscapeSequence).
// The calls to Object.freeze use the original definition of that method.
const unguessableCallSiteId1234 = Object.freeze({
  raw: Object.freeze(["literalPortion\\0 ", "literalPortion1"]),
  cooked: Object.freeze(["literalPortion\u0000 ", "literalPortion1"])
});

...

  // In-situ
  // Escape sequences in the arguments are decoded.
  // unguessableCallSiteId1234 is ideal as a key into a weak map used to memoize
  // extraction of meta-data, custom escaping conventions, and other state
  // that can be derived from the literal portions, so does not vary from
  // call to call from the same call-site.
  quasiTag(unguessableCallSiteId1234, x)

EcmaScript Quasi-Literals - Desugaring

So arguments should contain the substitution values as you see with traceur but the literal portions are an object and not an array.

If you want to implement it for code compiled with traceur you could do something like in the following unoptimized example.

let concatenated = "";
Array.forEach(args[0], (e, i) =>
    concatenated += e + ( i < arguments.length - 1 ? arguments[i+1] : "")
);

For real ECMAScript 6 code take a look at the Default Quasi Tag implementation, as bergi suggested in the comments.

这篇关于ES6标签模板功能如何解释其参数顺序？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！