文字列のフォーマット（String.Format的な処理）

JavaScriptで引数で渡したパラメータを埋め込んで文字列を返してくれる方法です。

C#とかだとString.Formatを使って簡単にできるのですが、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];
    });
};

// 動作確認（引数可変版）
function testArr(){
    var msg = formatByArr("ID：{0}、TITLE：{1}", 12345, "タイトル");
    console.log(msg);   // ID：12345、TITLE：タイトル
}

// 動作確認（オブジェクト版）
function testObj(){
    var msg = formatByObj("ID：{id}、TITLE：{title}", { id: 12345, title: "タイトル" });
    console.log(msg);   // ID：12345、TITLE：タイトル
}

フォーマットの方法もそうですが、JavaScriptで引数を可変で処理することができることを今回初めて知りました。

TypeScriptから変換されたJSファイルを見ると結構勉強になりますね。ちなみにTypeScriptで可変長の引数を定義する場合、以下のような感じになります。

public static formatByArr(msg: string, ...args: any[]): string {
    return msg.replace(/\{(\d+)\}/g, (m, k) => {
        return args[k];        
    });
}

TypeScriptに慣れるとJavaScriptにはなかなか戻れません。

• JavaScript で文字列フォーマットを実装してみた(sprintf もどき) | phiary