【フレアのJavaScript入門記7日目】文字列のイロハ　－その2－

こんにちは、フレアです。
前回は、5つあるデータ型の1つ、文字列の表示方法について勉強しました。
今回も引き続き、「文字列型」について学んでいきます。

文字列の結合

プログラム次第では、文字列を結合させたりする場合などがある。
文字列の場合は、繋げたい文字の間に＋の演算子を加えて表現できる。数字の計算のように、A＋Bといった具合に書けばよい。

const a = 'java' + 'Script';
console.log(a);

－－－－－－－－－－実行結果－－－－－－－－－－
JavaScript 

変数を応用すれば下記のようなこともできる。

const a = 'Alice';
const text = '私の名前は' + a + 'です';
console.log(text);

－－－－－－－－－－実行結果－－－－－－－－－－
私の名前はAliceです

エスケープ表記で長い文章を繋げる

文章を結合させた際、改行なしではとても読みづらくなってしまうので、+でつなげる直前にエスケープ表記を挟み込んでやるといい感じに改行出来てよき。

const longText = '後ろで大きな爆発音がした。\n' +
                 '俺は驚いて振り返った。';
console.log(longText);

－－－－－－－－－－実行結果－－－－－－－－－－
後ろで大きな爆発音がした。
俺は驚いて振り返った。

文字列操作を便利に「テンプレートリテラル」

変数＋文字列のように繋げることで変数を用いた結合を勉強してきたが、結合数が多くなってくるとコードが冗長になりがち。実はもっと簡単な方法がある。

console.log(`私の名前は${name}です`);

上記のように、文字列全体を「'」クォーテーションではなく
「`」（バックティック）
変数を使いたい場所で
${変数}
と書くことで、その変数を文字列の中に挿入しつつ文字列をより簡単に記述できる。

const name = 'Alice';
const b = `私の名前は${name}です`;　// テンプレートリテラルを用いて書き換えたコード
console.log(b);

－－－－－－－－－－実行結果－－－－－－－－－－
私の名前はAliceです

'単語'　+　変数　＋　'単語'
と記述するか、
`単語${変数}単語`
と記述するかの違い。

このテンプレートリテラルの何が良いかというと、改行時にエスケープ表記の「\n」を使わなくても、普通に改行すればテキストも改行される点。

const longText = `後ろで大きな爆発音がした。
                  俺は驚いて振り返った。`;
console.log(longText);

－－－－－－－－－－実行結果－－－－－－－－－－
後ろで大きな爆発音がした。
俺は驚いて振り返った。

このほうがコードを書く方もクォーテーションやらエスケープ表記やらで気を使わなくても済むし、読む方も読みやすいはず。

---

checkテスト【文字列型】

Q1.以下のコードが正しく動くように修正しろ！

let text = '私は'JavaScript'を学ぶ';

let text = '私は\'JavaScript\'を学ぶ';

Q2.文字列の中に変数textを展開する方法で最も正しいものをすべて選べ！！

A.　'文字列と' + text + 'です'
B.　'文字列と' . text . 'です'
C.　`文字列と${text}です`
D.　`文字列と#{text}です`

AとC