PHPだと、
$hoge = "ほげ";
$huga = "ああああああ{$hoge}いいいい";
結果: ああああああほげいいいい
というような記述が出来ると思いますが、JavaScript(jQuery)で似たような記述方法ってあるでしょうか?
検索したのですが、見つけられなかったため質問です。
スタック・オーバーフローはプログラマーとプログラミングに熱心な人のためのQ&Aサイトです。すぐ登録できます。
登録してこのコミュニティに参加するES2015(ES6) から導入された Template Literals がまさにその機能です。通常文字列リテラルに使われる ''
' ""
の代わりに ``
で囲み、その中に ${ }
で囲んだ式を埋め込むことができます。
Template strings - JavaScript | MDN
var hoge = "ほげ";
document.write(`ああああああ${hoge}いいいい<br/>`);
var foo = 16;
document.write(`${foo} * 2 = ${foo * 2}`);
対応状況としてはInternetExplorerとAndroidBrowser、iOS8以前のSafariで使えないぐらいで、最新のモダンブラウザであれば普通に使うことができます。
https://kangax.github.io/compat-table/es6/#test-template_literals
それ以前のブラウザでも動かしたい場合、あるいはHTML出力などでエスケープ処理が必要な場合は、テンプレートエンジンを使うことになるかと思います。jQueryでもそのような機能は持ち合わせていません。
old IEなども対応しなければならない状況なら、underscore.js#template がいいかもしれません.
http://underscorejs.org/#template
<script src="underscore.js"></script>
<script>
(function() {
var myStr = '!hello world!';
var myTemplate = _.template('result: <%= variableNameInTemplate1 %>');
// "result: !hello world!"
console.log(myTemplate({variableNameInTemplate1: myStr}));
})();
</script>
babelなどのトランスパイラも必要なく、単独で動作するので手軽です.
1行程度の操作なら文字列連結で済ませるのがよいです.
HTML片の出力のような、大きな文字列を生成するなら一考に値すると思います.
sprintf関数がなさそうなので、replaceを利用する方法もよいかもしれません。
var $hoge = "ほげ";
var $huga = "ああああああ%hogeいいいい".replace("%hoge", $hoge);
template literal
を使ってみてはどうですか。具体的には `(バッククォート)で対象文字列を囲みます。var huga = `ああああああ${hoge}いいいい`;