56

私は新しいES6 Template Literals機能で遊んでいて、最初に頭に浮かんだのString.formatは JavaScript 用だったので、プロトタイプの実装に取り​​掛かりました:

String.prototype.format = function() {
  var self = this;
  arguments.forEach(function(val,idx) {
    self["p"+idx] = val;
  });
  return this.toString();
};
console.log(`Hello, ${p0}. This is a ${p1}`.format("world", "test"));

ES6フィドル

ただし、テンプレート リテラルは、プロトタイプ メソッドに渡される前に評価されます。上記のコードを記述して、要素を動的に作成するまで結果を延期する方法はありますか?

4

8 に答える 8

67

これを回避する方法は 3 つあります。

  • format機能なしで、使用するように設計されたようにテンプレート文字列を使用します。

    console.log(`Hello, ${"world"}. This is a ${"test"}`);
// might make more sense with variables:
var p0 = "world", p1 = "test";
console.log(`Hello, ${p0}. This is a ${p1}`);

    または、評価を実際に延期するための関数パラメータさえも:

    const welcome = (p0, p1) => `Hello, ${p0}. This is a ${p1}`;
console.log(welcome("world", "test"));

  • テンプレート文字列を使用しないでください。プレーンな文字列リテラルを使用してください。

    String.prototype.format = function() {
    var args = arguments;
    return this.replace(/\$\{p(\d)\}/g, function(match, id) {
        return args[id];
    });
};
console.log("Hello, ${p0}. This is a ${p1}".format("world", "test"));

  • タグ付きのテンプレート リテラルを使用します。置換はハンドラーによってインターセプトされずに引き続き評価されることに注意してください。そのため、そのようなp0名前の変数がないと、のような識別子を使用できません。この動作は、別の代替ボディ構文の提案が受け入れられた場合に変更される可能性があります(更新: 受け入れられませんでした)。

    function formatter(literals, ...substitutions) {
    return {
        format: function() {
            var out = [];
            for(var i=0, k=0; i < literals.length; i++) {
                out[k++] = literals[i];
                out[k++] = arguments[substitutions[i]];
            }
            out[k] = literals[i];
            return out.join("");
        }
    };
}
console.log(formatter`Hello, ${0}. This is a ${1}`.format("world", "test"));
// Notice the number literals: ^               ^
于 2014-03-24T19:50:16.823 に答える
3

AFAIS、便利な機能「文字列テンプレートの遅延実行」はまだ利用できません。ただし、ラムダを使用することは、表現力があり、読みやすく、短い解決策です。 

var greetingTmpl = (...p)=>`Hello, ${p[0]}. This is a ${p[1]}`;

console.log( greetingTmpl("world","test") );
console.log( greetingTmpl("@CodingIntrigue","try") );
于 2019-03-15T13:14:18.147 に答える