【JavaScrpit】ヒアドキュメントを使いたい

2020.10.08

JavaScriptでヒアドキュメントとか、特定文字を値で置換とかしたかった。
たまに使いたくなるのでメモ。

参考

Javascriptでヒアドキュメント - Qiita
そろそろ「テンプレート文字列」を使用しても問題なくなってきたので、こちらを使用しまよう。 テンプレート文字列 - JavaScript | MDN Multi-line strings in JavaScript and No...
qiita.com
JSのObjectをforEachで処理する方法 - Qiita
どうにかforEachで出来ないのかなと思って調べる。 // こういうオブジェクトがあったとしてね var obj = { tanuki:'pon-poko', kitsune:'kon-kon', neko:'nyan-nyan'...
qiita.com

今のやり方

テンプレート文字列というのが使えるらしい。

テンプレートリテラル (テンプレート文字列) - JavaScript | MDN
テンプレートリテラルはバックティック (```) で区切られたリテラルで、substitutionと呼ばれる埋め込み式が利用できます。
developer.mozilla.org

バッククォート（shift+@で出てくる「`」のこと）で囲むと、改行などがそのまま反映されるヒアドキュメントになる。
${なんとか}と書くとプレースホルダーになって、中に書いた変数や式の計算結果が渡せるらしい。

let aa = "なにもない";
let bb = "あるかも";

let txt = `
ヒアドキュメント
だよ
${aa}
${bb}
${aa}`

console.log(txt);


ヒアドキュメント
だよ
なにもない
あるかも
なにもない

過去のやり方

テンプレート文字列が使えるようになる以前は、関数にコメント書いておくと返却してくれるので、コメント用の記号を取り払って、文字だけにしようという方法でヒアドキュメントを実現していたらしい。
オブジェクト渡して置換はテンプレート文字列でもできそう。

// ヒアドキュメントと置換
function heredoc(tmp, dic){
    let txt = tmp.toString().match(/(?:\/\*(?:[\s\S]*?)\*\/)/).pop().replace(/^\/\*/, "").replace(/\*\/$/, "");

    // 置換対象あれば置換
    if(dic == null){
        return txt;
    }

    Object.keys(dic).forEach(function (key) {
        txt = txt.replaceAll("{"+key+"}", dic[key]);
    });
    return txt;
}

txt = heredoc(function(){/*
ヒアドキュメント
だよ
{aa}
{bb}
{aa}
*/},{"aa":"なにもない","bb":"あるかも"});

console.log(txt);

ヒアドキュメント
だよ
なにもない
あるかも
なにもない

ふたつをまぜる

テンプレート文字列を使って文字も置換してみる。
もっといい方法がありそうな気がする。

txt = heredoc(`
ヒアドキュメント
だよ
{aa}
{bb}
{aa}
`,{"aa":"なにもない","bb":"あるかも"});

console.log(txt)

function heredoc(txt, dic){
    // 置換対象がなければ無視
    if(dic == null) return txt;

    Object.keys(dic).forEach(function (key) {
        txt = txt.replaceAll("{"+key+"}", dic[key]);
    });
    return txt;
}

ヒアドキュメント
だよ
なにもない
あるかも
なにもない

おわり。

スポンサーリンク