187

tl;dr: 再利用可能なテンプレートをリテラルにすることは可能ですか?

私はテンプレート リテラルを使用しようとしてきましたが、私はそれを理解していないと思います。今はイライラしています。つまり、私はそれを理解していると思いますが、「それ」は、それがどのように機能するか、またはどのように取得されるかであってはなりません。それは違うものになるはずです。

私が目にするすべての例 (タグ付けされたテンプレートも含む) では、実行時ではなく宣言時に「置換」を行う必要があります。気が狂っているかもしれませんが、私にとっての「テンプレート」とは、作成時ではなく、使用時に置換されるトークンを含むドキュメントです。それ以外の場合は、単なるドキュメント (つまり、文字列) です。テンプレートはトークンとともにトークンとして保存され、それらのトークンは評価時に評価されます。

誰もが次のような恐ろしい例を挙げています。

var a = 'asd';
return `Worthless ${a}!`

それはいいことですが、もし私がすでに を知っているならa、私は単にreturn 'Worthless asd'またはreturn 'Worthless '+a. ポイントは何ですか？真剣に。さて、ポイントは怠惰です。プラスが少なくなり、読みやすくなります。偉大な。しかし、それはテンプレートではありません。私見ではありません。そして、MHO だけが重要です。私見の問題は、テンプレートが宣言されたときに評価されることです。

var tpl = `My ${expletive} template`;
function go() { return tpl; }
go(); // SPACE-TIME ENDS!

は宣言されていないためexpletive、次のように出力されますMy undefined template。素晴らしい。実際、少なくとも Chrome では、テンプレートを宣言することさえできません。expletiveが定義されていないため、エラーがスローされます。私が必要とするのは、テンプレートを宣言した後に置換を行うことができることです:

var tpl = `My ${expletive} template`;
function go() { return tpl; }
var expletive = 'great';
go(); // My great template

ただし、これらは実際にはテンプレートではないため、これがどのように可能かはわかりません。タグを使うべきだとあなたが言ったとしても、いいえ、それらは機能しません:

> explete = function(a,b) { console.log(a); console.log(b); }
< function (a,b) { console.log(a); console.log(b); }
> var tpl = explete`My ${expletive} template`
< VM2323:2 Uncaught ReferenceError: expletive is not defined...

以上のことから、テンプレート リテラルはひどく誤った名前であり、本来の名前であるヒアドキュメントと呼ばれるべきであると考えるようになりました。「リテラル」の部分が私にひっくり返ったはずだと思います（不変のように）？

何か不足していますか？再利用可能なテンプレートをリテラルにする (良い) 方法はありますか?

再利用可能なテンプレート リテラルを提供します。

> function out(t) { console.log(eval(t)); }
  var template = `\`This is
  my \${expletive} reusable
  template!\``;
  out(template);
  var expletive = 'curious';
  out(template);
  var expletive = 'AMAZING';
  out(template);
< This is
  my undefined reusable
  template!
  This is
  my curious reusable
  template!
  This is
  my AMAZING reusable
  template!

そして、ここに単純な「ヘルパー」関数があります...

function t(t) { return '`'+t.replace('{','${')+'`'; }
var template = t(`This is
my {expletive} reusable
template!`);

...「より良く」するために。

ねじれた感情を生み出す領域があるため、私はそれらをテンプレート腸管と呼ぶ傾向があります.

4

24 に答える 24

88

テンプレート文字列を関数に入れることができます:

function reusable(a, b) {
  return `a is ${a} and b is ${b}`;
}

タグ付けされたテンプレートで同じことを行うことができます:

function reusable(strings) {
  return function(... vals) {
    return strings.map(function(s, i) {
      return `${s}${vals[i] || ""}`;
    }).join("");
  };
}

var tagged = reusable`a is ${0} and b is ${1}`; // dummy "parameters"
console.log(tagged("hello", "world"));
// prints "a is hello b is world"
console.log(tagged("mars", "jupiter"));
// prints "a is mars b is jupiter"

アイデアは、テンプレート パーサーが定数文字列を変数 "slots" から分割し、毎回新しい値のセットに基づいてすべてをパッチする関数を返すようにすることです。

于 2015-05-02T14:25:13.593 に答える