https://idea-hack.com/courses/how-to-handle-boolean-values-numbers-and-characters-in-javascript/lessons/two-ways-to-handle-variables-inside-a-string-with-javascript/
https://idea-hack.com/courses/how-to-handle-boolean-values-numbers-and-characters-in-javascript/lessons/two-ways-to-handle-variables-inside-a-string-with-javascript/

JavaScriptで文字列内で変数を扱う2つの方法

JavaScriptでは、文字列の中で変数を扱いたい時があります。

書き方が2つありますので、それぞれ紹介します。

構文

構文意味
‘文字列’ + 変数 + ‘文字列’・・・文字列と変数の結合
`文字列${変数}文字列` 文字列と変数の結合
文字列内で変数を使う

サンプルコード

サンプルとして、2つのやり方で同じ文字を結合して出力するコードを紹介します。

Output
‘私は’ + targetString + ‘を勉強しています。’
`私は${targetString}を勉強しています。`
Pug
.container.my-5
	table.table
		tr
			th '私は' + targetString + 'を勉強しています。'
			td.result1
		tr
			th `私は${targetString}を勉強しています。`
			td.result2
JavaScript
const targetString = 'JavaScript';

document.querySelector('.result1').textContent = '私は' + targetString + 'を勉強しています。';
document.querySelector('.result2').textContent = `私は${targetString}を勉強しています。`;
インストラクター
コメント

コメントを残す