テンプレートリテラルの使いどころは？

256timesのサービス開発はちょっと進んで、UI/UXの観点からレビュー中です。スクール運営で困っていたところをシステム化できないかな？という視点で開発を進めていたのですが、やはり一度どこかで「理想的な全体像はどうなるか？」を整理しないとな、と思っていたりします。そのあたりの作業は来週にかけて行っていく予定です。

それはそれとして今週もスクール運営中に気づいたことをコラム的に紹介してみます。

課題のレビューをしていると、「そこ、テンプレートリテラルじゃなくてもよくない...？」ということがよくありました。具体的には次のようなコードですね。

console.log(`${name}`);

これは次のように書いたほうが素直です。

console.log(name);

テンプレートリテラルは文字列に値を埋め込むときに使うべきですね。例えば次のようなコードはクォーテーションマークの対応や空白を考慮しなくていけないので書きにくいし、読みにくいです。

console.log('My name is '  + name + '.  I am ' + age + ' years old');

こうした場合にこそテンプレートリテラルを使うべきで、次のようにすっきりと書けます。

console.log('My Name is ${name}.  I am ${age} years old');

テンプレートリテラルに限らず、覚えたものをすぐに使いたくなる気持ちはよくわかりますし、使いながら慣れていくのはとても良いと思います。ただ、使いどころを誤ると逆にわかりにくいコードになるので注意しておくと良いでしょう。

プログラミングはたくさんの書き方があるがゆえに楽しいのですが、どの書き方が一番わかりやすいかな？と考える癖をつけておくといいかもしれませんね。