文字列のフォーマット

TypeScriptで文字列をフォーマットする方法です。

方法としてはES6（ES2015）のテンプレート文字列を使うか、自前で用意したものを利用するかのどちらかだと思います。

ES6のテンプレート文字列を使った書き方は以下の通りです。

var i = 1;
var s = "string";
console.log(`数値：${i}、文字列：${s}`);    // 数値：1、文字列：string

文字列をダブルクォーテーション（""）やシングルクォーテーション（''）で囲むのではなくバックティック文字（``）で囲むのが特徴です。

JavaScriptに変換されたコードを見ると以下のようになっていました。

var i = 1;
var s = "string";
console.log("\u6570\u5024\uFF1A" + i + "\u3001\u6587\u5B57\u5217\uFF1A" + s); // 数値：1、文字列：string

バックティック文字（``）を使った箇所だけ、文字列がエンコードされてます。

テンプレート文字を利用する場合、何度も利用するメッセージを外出し（定数）とかにできないっぽいので（メッセージ中に使用されている変数が存在しないと構文エラーになる）、そういった処理を行う時は自前で用意したものを使った方がよさそうです。

可変部を配列またはオブジェクトで渡す場合の埋め込み処理は以下の通りです。

// フォーマット（配列版）
function formatByArr(msg: string, ...args: any[]): string {
    return msg.replace(/\{(\d+)\}/g, (m, k) => {  // m="{0}", k="0"
        return args[k];
    });
}

// フォーマット（オブジェクト版）
function formatByObj(msg: string, obj: any): string {
    return msg.replace(/\{(\w+)\}/g, (m, k) => {  // m="{id}", k="id"
        return obj[k];
    });
}

実際の使用方法。

var msgArr = "数値：{0}、文字列：{1}";
console.log(formatByArr(msgArr, 2, "string2"));                 // 数値：2、文字列：string2

var msgObj = "数値：{id}、文字列：{name}";
console.log(formatByObj(msgObj, { id: 3, name: "string3" }));   // 数値：3、文字列：string3

変換されたJavaScriptのコードは以下の通り。

// フォーマット（配列版）
function formatByArr(msg) {
    var args = [];
    for (var _i = 1; _i < arguments.length; _i++) {
        args[_i - 1] = arguments[_i];
    }
    return msg.replace(/\{(\d+)\}/g, function (m, k) {
        return args[k];
    });
}

// フォーマット（オブジェクト版）
function formatByObj(msg, obj) {
    return msg.replace(/\{(\w+)\}/g, function (m, k) {
        return obj[k];
    });
}

var msgArr = "数値：{0}、文字列：{1}";
console.log(formatByArr(msgArr, 2, "string2")); // 数値：2、文字列：string2

var msgObj = "数値：{id}、文字列：{name}";
console.log(formatByObj(msgObj, { id: 3, name: "string3" })); // 数値：3、文字列：string3

• テンプレート文字列 - JavaScript | MDN