` これなんという名前ですか ?

Question

let targets = document.querySelectorAll(`input[type='checkbox'][name='fruits']`);

for (let e of targets) {
	e.addEventListener(`change`, () => {
		console.log(e.value, e.checked);
	})
}

上記の文を見ました。
その中で ` これなんという名前ですか ?
何の為に使ってるかよくわかりません。

特に、
e.addEventListener(`change`これは、
e.addEventListener('change'  これで、良いような気もする。

fujillin · Accepted Answer

こんにちは

「` 」はバッククォートです。（@キーの半角シフト部分にあると思います）
これで囲まれた部分は「テンプレートリテラル」と言われています。

通常は、可変部分を含む文字列等をテンプレートにしておいて、可変部分を変数を用いて代入してゆくような使い方が多いと思います。
https://developer.mozilla.org/ja/docs/Learn/JavaScript/First_steps/Strings
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Template_literals

可変部分が無い場合は、評価結果は元の文字列と同じになりますので、ご提示の例の場合はご指摘の通り 'change' としても変わりはありません。 （テンプレートにしている意味がない）

yambejp · Answer

テンプレートリテラルといって面倒なエスケープや改行処理を勘弁にするために導入されています

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Template_literals

> 'change' これで、良いような

あまり多様するのはよくないので、特に問題ない箇所ではシングルクォートで処理するほうがよいでしょう

asato87 · Answer

バッククォートという記号です。
使い方としては、シングルクォートで囲んだ文字列の中に同じシングルクォートが含まれる場合、そこで終わりと勘違いされるのを防ぐために
シングルクォートを重ねる必要がありますが、見づらくなるため両端のシングルクォートをバッククォートに替えることで
文字列中のシングルクォートと重なることがなくなって見やすくなるというような場合ですから、
仰る通りこの例だとシングルクォートで良くバッククォートの必要はないように見えますね。
1行目の表記と統一性を持たせようとしたんじゃないでしょうかね。

` これなんという名前ですか ?

こんにちは

テンプレートリテラルといって面倒なエスケープや改行処理を勘弁にするために導入されています

バッククォートという記号です。

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング