動的評価用に再利用可能な ES6 テンプレート リテラルを作成するにはどうすればよいですか?

再利用可能な ES6 テンプレート リテラル

課題:

開発者は、ES6 テンプレート リテラルが文字列補間にとって非常に貴重であると感じることがよくあります。ただし、実行時にこれらのリテラルを再利用または評価しようとすると、一般的にフラストレーションが発生します。置換は常に宣言時に行う必要があり、テンプレートとしての実用性が制限されているようです。

解決策:

この制限を克服し、再利用可能なテンプレート リテラルを作成するには、再利用して動的に評価するには、中間段階を導入する必要があります。

関数コンストラクターの使用:

再利用性の鍵は、関数コンストラクターを利用してテンプレートをラップすることにあります。弦。これにより、テンプレートは基本的に、特定の変数値を使用して後で呼び出すことができる JavaScript 関数に変換されます。

<code class="js">const templateString = "Hello ${this.name}!";
const templateVars = {
    name: "world"
};

const fillTemplate = function (templateString, templateVars) {
    return new Function("return `" + templateString + "`;").call(templateVars);
};

console.log(fillTemplate(templateString, templateVars)); // Output: "Hello world!"</code>

この例では、fillTemplate 関数はテンプレート文字列と変数オブジェクトの両方を引数として受け取ります。 。テンプレートを関数でラップし、指定された変数値を使用してその関数を呼び出した結果を返します。これにより、テンプレートを動的に評価し、毎回異なる変数値を差し込むことができます。

追加の考慮事項:

この方法は再利用性の問題の回避策を提供しますが、また、潜在的な制限も発生します。

• テンプレート タグを組み込むのがより困難になります。
• 遅延補間のため、インライン JavaScript ロジックを含めることができません。

代替アプローチ:

再利用可能でランタイム評価されるテンプレートのためのより包括的なソリューションを提供する代替テンプレート エンジン ライブラリを検討することを好む人もいるかもしれません。

以上が動的評価用に再利用可能な ES6 テンプレート リテラルを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。