BOOK Studio947
狩野祐東・狩野さやか著書

サンプルをメモ帳で開くと改行されない

読者の方から質問を頂戴しました。
確かな力が身につくJavaScript「超」入門』のサンプルデータをダウンロードして、Windowsのメモ帳で開くと、ソースが改行されないことがあります。

メモ帳で開くと、ソースが改行されず長い1行で表示される(サンプル2-02/script.js)

 通常、ソースが改行されなくてもサンプルの動作に問題はありません。が、サンプル2-02のように、JavaScriptファイルの1行目がコメント(//)で始まっている場合、ソースが1行になることにより、後続のすべてのプログラムがコメントアウトされてしまいます。結果としてプログラムが実行されなくなってしまいます。

対処法は?

 メモ帳以外の、本書p.20で紹介しているようなテキストエディタをお使いください。Windowsのメモ帳以外のテキストエディタでは、この問題は発生しません。

なぜこんなことが起こるの?

 プログラムのソースコードに限らず、テキストが改行されている部分──つまりEnterキーを押したとき──には、目に見えない文字が打ち込まれています。この文字のことを「改行コード」と言います。改行コードには3種類あり、Windowsでテキスト文書を作ると、改行のところには「キャリッジリターン(Carriage Return, CR)」と呼ばれる文字と「ラインフィード(Line Feed, LF)」と呼ばれる文字が2文字連続して打ち込まれます(もちろんこれらの文字は見えません)。このCRとLFが連続した部分が「改行コード」として認識され、テキストが改行されるのです。

3種類ある改行コード

  • CRLF(CRとLF 2文字連続)──Windowsの改行コード
  • LF──Mac OS/Unix/Linuxの改行コード
  • CR──昔のMac OSの改行コード*

* 15年くらい前のMac OSで使われていた改行コードで、現在は使われていません。

 このように、OSによって標準的に使われる改行コードが違います。ですが、現在使われているほぼすべてのテキストエディタ、およびWordなどのワープロは、どの改行コードで入力されていても、ファイルを開く際に自動的に認識するようになっています。そのため、改行コードを気にする必要はほとんどありません──Windowsのメモ帳を除いて。

 Webサイトのファイルとして作成するHTML、CSS、JavaScriptなどは、どの改行コードを使っていても正しく動作するので心配ありません。『確かな力が身につくJavaScript「超」入門』のサンプルデータは、改行コードLFで作成されています(今後変更するかもしれませんが)。そのため、メモ帳で開くと改行されないのですね。

 もうひとつメモ帳には、改行されない以上にちょっとやっかいな問題もあり、Webサイトで使うデータの種類によってはまれに誤動作を引き起こす場合があります。詳しくは「HTMLやCSSファイル作成時の文字コードはUTF-8BOMなしで」も参考にしてみてください。

 ということで、Webサイトで使うプログラムを書くときに、「改行コードは心配する必要ない」「メモ帳は使わない」と覚えておきましょう。

おすすめのテキストエディタ

 本書をお持ちでない方のために、おすすめのテキストエディタを紹介しておきます。本書で紹介しているものも、紹介していないものもあげておきます。

狩野 祐東

Web/アプリケーションUIデザイナー、エンジニア。執筆家。 アメリカ・サンフランシスコに留学、UIデザイン理論を学ぶ。Webサイトやアプリケーションのデザイン・開発、関連技術書籍の執筆を数多く手がける。株式会社Studio947代表。