支援対象地域:札幌、仙台、関東、愛知、関西、広島、福岡


JavaScriptは2つの側面を持つので改行も2種類ある

JavaScriptはWeb画面を担うHTMLの部分と一般的なプログラミング言語の部分の2つを併せ持った言語です。Web画面に表示されることが前提の言語のため、容易に文字列等を出力させることができます。従来のHTMLでは静止画面が主でしたが、JavaScriptによって動きを付けることが容易になりました。Web画面を動的に変化させることができるのがJavaScriptの大きな特徴ですが、画面管理だけに留まらない点がこの言語の重要な部分です。通常のプログラミング言語的側面を持っているため、JavaScriptだけで画面の管理とデータ操作、画面へのデータの受け渡しを行うことができます。両方の側面を併せ持つことでデータの受け渡しという、別のプログラミング言語同士を使っていた場合にハードルとなる箇所を解消しています。このように他のプログラミング言語と違い、デフォルトで2つの要因を併せ持つJavaScriptのため、データの出力方法も状況によって変化することがあります。文字列に含まれる改行はその一つです。2つの側面を持っているため、改行は文字列がどこで使用されるかによって表現方法を変える必要があります。JavaScriptは2つの側面があるために知識をより多く持っている必要がある言語です。

Web画面はタグによって管理されている

Web画面で表示する文字はタグによって管理されており、タグを通じて機械は判断することができます。そしてタグに含まれる要素によってさまざまな動作をすることができます。JavaScriptで操作する際にも要素が利用されます。要素を足掛かりとして操作箇所を特定し任意の処理を実行させることができます。HTMLはタグを用いてWeb画面を構成しており、改行においてもタグを利用しています。改行は基本的にpタグが利用されます。

pタグ

pタグと/pタグで囲むと機械は一つのまとまりとして認識することができます。これがHTMLで文章を表示させる際の基本となります。Web画面ではpタグのまとまりを利用して改行を表現させることができます。つまり改行という処理方法があるわけではなく、文章のまとまりをうまく利用することで改行を表現させていることになります。そのため、機械的には別のグループ扱いになっています。改行に対する人間の感覚と機械の捉え方にはズレが生じることを理解した上で利用することが必要になります。Web画面に表示するだけの利用等使い捨てる場合であればあまり問題にはなりません。ですがpタグのグループごとに文字列データを収集し格納、またはデータ分析に用いる場合に注意が必要になります。人間にとって改行は見やすくするためのものであり、文章のまとまりを切ることが目的ではありません。大きくまとまりを切る場合は表題を変えるなどの手段を用います。ですがpタグを改行として利用することで機械は別グループとして認識してしまうため、それでは都合が悪い場合はbrタグを利用する必要があります。

brタグ

brタグを使うことで強制的に改行することが可能です。brタグを適切に行うことでpタググループのまとまりを壊さずに改行を表現することができます。

タグの乱用を避けCSSを併用して行間を調整する

pタグでまとまりを作ることによりグループごとに余白が生まれます。余白が足りない場合にすぐに思いつく方法として空のpタグのグループを複数作成するやり方があります。しかしそのやり方はスマートではありません。プログラムファイルとしてまず綺麗な書き方ではありません。プログラムはなるべく綺麗に整えてあるほうが、後々見返しやすくなります。また、空のpタグのグループを増産するのは、pタグを文字列のデータグループとして見た場合に余計なデータになってしまうことも懸念点となります。データは値が重要な時もありますが、統計的に利用する場合もあります。空のpタグを行間のために増やしてしまうと統計データとして使える可能性が低くなってしまいます。CSSを利用することでスマートに実現できるためタグの乱用は控えることが大事です。

データとしての改行

データに含まれる改行の場合は、一般のプログラミング言語と同じく特殊文字で表記することができます。 を記述することで改行として認識されます。Web画面のコンソールに表示する場合はこちらの手法を使うことになります。

注意点としては文字列データをそのままWeb画面に出力すると改行が表現されない点です。特殊文字を認識させ変換する手間が必要になります。

まとめ

JavaScriptはWeb画面とデータ処理の両方を行うことができます。改行を行う場合は、それぞれの状況に応じて方法を変える必要があります。Web画面ではタグを、データ処理としては特殊文字を使うことで対応することができます。