「業務の効率化のためのプログラミング入門」というシリーズの記事です。
前回は数値と数値計算の扱い方を学びました。
今回は文字列の扱いについて解説していきます。
文字列は数値と並んで重要な基礎知識ですのでイチから丁寧に使い方を見ていきましょう。
文字列を定義しよう
まずはプログラムを実行して、動作を確認してみましょう。
次のプログラムをコピペして実行してみてください。
プログラム
function myFunction() {
let name = "佐藤"
console.log(name)
}実行結果
佐藤
佐藤という文字列が出力されました。
文字列の定義
「”」(ダブルクォーテーション)で囲われた間が文字列として定義されます。
※「’」(シングルクォーテーション)でも可
数字でもあっても、「”」で囲うと数値ではなく文字列として扱われます。
たとえば次のようなプログラムを実行した場合、出力はどうなるでしょうか。
プログラム
function myFunction() {
let number1 = "1"
let number2 = "2"
let answer = number1 + number2
console.log(answer)
}実行結果
12
「1+2=3」のように数値として計算されるのではなく、1と2をそれぞれ文字として結合した結果が出力されました。
このように数字を扱う場合は、文字として定義したのか、数値として定義したのか明確に区別する必要があります。
文字列の結合
二つの文字列を「+」で結合できることを先ほど紹介しました。
では、次のような文字列と数値を結合した場合はどうなるのでしょうか。
次のプログラムを実行して確かめてみましょう。
プログラム
function myFunction() {
let name = "佐藤"
let number1 = 1
let number2 = 2
let answer = name + number1 + number2
console.log(answer)
}プログラム内では、nameには文字列の「佐藤」
number1と2の二つの変数には「””」で囲われていない数値が格納されています。
実行結果
佐藤12
数値として値を格納した変数も文字列として結合されました。
ちょっと予想外の動作ではなかったでしょうか？
文字列と数値と結合した場合の動作
文字列が式の左側にある場合、それと結合する数値は文字列として扱われます。
文字列においても数値の四則演算と同じく、式は左側から計算されます。
そのとき、左側に文字列がある場合JavaScriptでは右側も文字列と解釈して結合します。
プログラムを少し書き換えて、数値が一番左に来た場合はどうなるのか確認してみましょう。
プログラム
function myFunction() {
let name = "佐藤"
let number1 = 1
let number2 = 2
let answer = number1 + number2 + name
console.log(answer)
}実行結果
3佐藤
「12佐藤」ではなく、「3佐藤」と「1+2=3」が計算された結果が文字列として結合された結果が表示されました。
式を左から評価したとき、「数値+数値」で足し算が先に処理された結果の出力です。
このように数値と文字列の計算順によっては、予想外の結果になることがありますので値が数値なのか文字列なのか常に意識しながら結合するようにしましょう。
テンプレート文字列
「私の名前は佐藤です。年齢は20歳です。」
このような文字列を名前と年齢部分を変数にして出力したい場合、次のようなプログラムになると思います。
プログラム
function myFunction() {
let name = "佐藤"
let age = "20"
console.log("私の名前は" + name + "です。年齢は" + age + "です。")
}変数と文字列を「+」で結合して、一つの文字列として出力しています。
ですが、console.logの中が「+」での結合が冗長で読みづらくなっています。
そんな場合にテンプレート文字列という仕組みを利用して簡潔に記述することができます。
プログラム
function myFunction() {
let name = "佐藤"
let age = "20"
console.log(`私の名前は${name}です。年齢は${age}です。`)
}`${変数名}`
「`」バッククォートで文字列全体を、変数名を「${}」で囲うと「+」を使うことなく簡潔に変数を埋め込むことができます。
「${}」のことをプレースホルダと呼びます。
まとめ
今回は「文字列の扱い」について解説しました。
前回学んだ数値と文字列はJavaScript上で違うものとして扱われ、区別して使わないと意図しない挙動を引き起こします。
定義した値が文字列なのか数値なのか（はたまた今後解説する別の概念なのか）は、常に意識してプログラムを書くようにしましょう。
連載目次
次の記事は「【配列】値をまとめて扱う方法」です。
“文字列”