今回は、JavaScriptでコードを書く際の基本的な作法についてまとめました。
私は学生時代にJavaScriptを独学で学習した程度ですが、最近、コーディングする機会があったので、こちらにまとめたいと思います。
以下の順にまとめています。
- 実行環境の準備
- JavaScriptのソースコード
- デバッグ
- ソースコードの記述場所
実行環境の準備
JavaScriptを実行するにはいくつか準備しなければならないことがあるので、
以下にポイントをまとめました。
JavaScriptを実行するにはブラウザが必要
JavaScriptは、ウェブブラウザ上で動くプログラミング言語です。
そのため、実行に必要な環境はブラウザのみです。
ブラウザは、ほとんどのパソコンにインストールされているので、特に準備は不要です。
例えば、WindowsではMicrosoft Edge、macOSならSafariが標準のブラウザとして
OSに含まれています。また、ChromeやFirefoxでも同様に準備は不要です。
ブラウザをそのまま利用するので、準備の負担は少なく、学習しやすいですね。
コーディングする際にはエディタを使用しよう
次に必要なことは、コーディング（ソースコードを記述すること）する際に
使用するエディタの準備です。
その前に、ソースコードとエディタについて簡単に説明します。
ソースコードとは、
プログラムに「どんな動作をさせたいか」という処理の内容を書いたテキストファイルです。
それぞれのプログラミング言語の文法に従い、文字情報のみのコードを記載したファイルを
その言語に合わせた拡張子で保存する、というのがプログラミングの基本的な作法となります。
ソースコードはテキストファイルのため、
テキストファイルを作成できるツールであれば特に問題ありません。
また、このようなツールのことをテキストエディタ（エディタ）といいます。
例えば、Windowsならメモ帳、macOSであればテキストエディットというものが、
標準で搭載されているかと思います。
標準で搭載されているエディタを使用しても特に問題ありませんが、
これから本格的にプログラミングをする人であれば、
コーディングに便利な機能が含まれているエディタを利用するのが良いでしょう。
エディタの種類は豊富で、
有償のエディタもありますが、以下で無償のエディタを紹介します。
| エディタ名 | サイトURL | OS |
| サクラエディタ | Windows | |
| mi | macOS | |
| Atom | Windows,macOS | |
| Visual Studio Code | Windows,macOS |
私は、Visual Studio Codeを使用していますが、
人によって好みがあると思いますので、自分に合ったエディタを使うのが良いですね。
文字コード、改行コードに注意してファイルを作成しよう
最後の準備として、文字コードと改行コードについて記載します。
エディタの準備ができたら、ファイルを作成してプログラムを記述したいところですが、
JavaScriptでは、以下の2点の設定に注意する必要があります。
- 文字コードはUTF-8
- 改行コードはLF
なぜこの2点を注意しなければならないかを簡単に解説していきます。
まず、文字コードについてです。
エディタで書かれたソースコードというのは、実はそのままコンピュータ上では実行できません。
なぜなら、コンピュータ内部では０と１のみで表現される2進数で処理を行っているからです。
ということは、すべてのデータが数値として表されています。
ちなみに、私たちが日常生活で使っている0~9までの10種類の数字は10進数といいます。
※2進数や10進数の詳しい説明は、ここでは割愛します。 →小文字
例えば、アルファベット大文字の「A」は10進数で65と割り振られています。
2進数の場合は、0100 0001となります。
このように、文字に割り当てられた数値のことを文字コードといいます。
文字コードにも様々な種類のものが存在しますが、
現在Webの世界ではUTF-8という文字コードが標準で使用されています。
そのため、エディタの文字コードは「UTF-8」に設定しておくと良いでしょう。
最後に、改行コードについて解説します。
先ほど説明したように、コンピュータ内部ではあらゆるものが数値として表されます。
そのため、改行も1つの文字データとして扱われており、
改行を表す文字データのことをLF（Line Feed）といいます。
UNIXをベースにしたOS（macOSやLinux）では、このLFのみで改行を表すことが可能ですが、
WindowsではCR（Carriage Return）の2文字を付けて、CRLFで改行を表すようになっています。
| 改行コード | プログラム中での記載 | OS |
| LF（Line Feed） | macOS,Linuxなど | |
| CRLF（Carriage Return +Line Feed ） | Windows |
基本的にはOS標準の改行コードでも問題ありませんが、
プログラムの場合は、実行環境に合わせた方が何かと都合が良いです。
ちなみにJavaScriptの場合は、macOSやLinuxと同じLF（Line Feed）の改行コードを使用します。
