テンプレート リテラル: 再利用の復活

ES6 のテンプレート リテラルは、強力なテキスト操作ツールとしてよく宣伝されますが、本当に再利用できるのか?

Unfulfillable Expectations

一見すると、テンプレート リテラルは宣言時にのみ動的置換を約束しているように見えます。ここで疑問が生じます: 静的なテンプレートとは何ですか?

サイクルの打破

一般的な考えに反して、テンプレート リテラルは、関数を使用した実行時の置換で再活性化できます。仲介者としてのコンストラクター:

const template = "Hello ${this.name}!";
const variables = {
  name: "world"
};
function fillTemplate(str, data) {
  return new Function("return `"   str   "`;").call(data);
}
console.log(fillTemplate(template, variables)); // Output: Hello world!

再利用可能なテンプレートの分析

この手法により、次のことが可能になります:

• ランタイムinterpolation: 従来のテンプレート エンジンと同様に、変数は動的に入力されます。
• Fragmentation: テンプレートは別のファイルに保存することも、動的に取得することもできます。
• ]動的作成: テンプレートはその場で構築および評価できます。

注意点への対処

この方法は蘇生機能を提供しますが、いくつかの注意点があります。注意事項:

• 制限付き JavaScript: 遅延補間のため、インライン JavaScript ロジックは使用できません。
• テンプレート タグ: テンプレート タグが難しくなります

これらの制限にもかかわらず、少し工夫することで、テンプレート リテラルが従来の制限を超えて真に再利用可能になることは明らかです。