2019/07/30

CoffeeScriptプログラミングの基礎【現役エンジニアがわかりやすく解説】

PROGRAM

CoffeeScriptプログラミングの基礎を知りたい方に。

この記事を読まれている方は、

CoffeeScriptのプログラミングがどんなものか知りたい
CoffeeScript言語の簡単な書き方が知りたい
CoffeeScriptが使われる場面を知りたい

おそらくこのように考えている方が多いと思います。

この記事を書いている私は、
プログラミング未経験から転職を果たした現役のWeb系エンジニアです。
エンジニア歴は３年ですが、本業とは別にフリーランスの副業で月１０万円ほど、多いときで２０万円ほどの収入があります。

この記事では、現役のエンジニアが、CoffeeScriptプログラミングの基礎を解説しています。

プログラミング言語のCoffeeScriptの特徴

CoffeeScriptはプログラミング言語のひとつで、動的型付けのコンパイル言語で、オブジェクト指向の特徴も持つ言語です。

動的型付けとは、簡単に言うと、データを文字列型や数値型、論理型などに分ける必要がない言語です。

コンパイル言語とは、プログラムの実行前に、開発者の方でコンパイラーを使って構文チェックなどをしたうえで中間言語に変換しないと動作しない言語のことです。

一方、スクリプト言語とは、プログラム実行前にコンパイルという、書いたプログラム文を中間言語に変換する作業の必要がない言語のことで、書いた後はすぐにプログラムを実行することができる言語のことです。

オブジェクト指向型言語とは、オブジェクトという概念を持つ言語のことで、簡単に言うと、データ構造として、配列や構造体に加えて、オブジェクト(クラス)があるということです。
オブジェクトのおかげで、ソースコードのメンテナンスがしやすかったり、機能の流用ができます。

CoffeeScriptはJavaScriptの拡張言語となっており、コンパイルするとJavaScriptに変換されます。したがって、コンパイル言語といってもJavaScriptに変わるので、変換後はスクリプト言語と言えます。

CoffeeScriptはJavaScriptに比べ、動的型付けの機能がさらに使いやすくなりました。
具体的には、変数宣言時のvarが不要になり、最低限の記述だけで動かせるようになりました。

その他には、例えば連想配列では括弧がいらなくなったり、記述全般では末尾のセミコロンが不要になったりと、プログラミング全般が簡単にできるようになっています。

また、JavaScriptは他の言語とは一味違ったオブジェクト指向の言語でしたが、CoffeeScriptではクラスベースのオブジェクト指向を取り入れていますので、他の言語と変わらずにコーディングすることができます。

CoffeeScriptは動的型付けの言語の中でもさらに書きやすくなった言語ですので、初心者には大変学びやすい言語となっています。フロントエンドではおそらく最も学習コストが低い言語と言えます。

これからJavaScriptを勉強される方は、最初の入り口としてCoffeeScriptを学習されると良いと思います。

CoffeeScriptの用途

CoffeeScriptは、主にブラウザで動作する、フロントエンドのプログラミング言語として使われます。
コンパイルするとJavaScriptになるので、JavaScriptを使えば良いじゃないか、と思われるかもしれませんが、初心者のエンジニアに配慮する場合やクラスベースのオブジェクト指向で開発したい現場などでCoffeeScriptが使われることがあります。

しかし、実際にCoffeeScriptを採用している現場はさほど見受けられません。
CoffeeScriptは統合開発環境(IDE)にVisual Studioも使えるので、とても開発しやすい言語ではあるのですが・・・。

CoffeeScriptの書き方

ここでは簡単に書き方を少しだけ紹介します。実際に始める気になったら、ぜひ参考書などの教材を参考にして、試してみて下さい。

Hello World!を画面に出力する

まずはお決まりのHello World!という文字列を画面に出力する方法から。

console.log("Hello World!");

これで出力することができます。
C言語やJavaなどとは異なり、main関数を書かなければ動かないということはなく、いきなりそのまま命令文を書くことができます。クラスもなしで動くので、オブジェクト指向は強制されていません。

最終的にJavaScriptに直さないといけないので、プログラムを実行する前にコンパイルが必要になります。
※今回の場合はJavaScriptのまんまの内容なのでコンパイルしなくても動きます。

変数宣言と分岐処理

次は少し踏み込んで、変数宣言と分岐処理をしてみます。

age = 19
if age < 20
    console.log("未成年")
else 
    console.log("成人")

上記の例では、まずageという数値型の変数を作り、その中に19という数値を入れています。
次にageが20未満であれば”未成年”という文字列を、それ以外であれば”成人”という文字列を出力するような分岐処理をしています。

配列と繰返処理

続いて、配列の使い方と繰返処理について、解説します。

ここでは配列を作って、以下のようにデータを出力することにしましょう。

佐藤,田中,小林

これを出力するコードは以下です。

students = ["佐藤", "田中", "小林"]

output = ""
for i in [0..students.length-1]
    output += students[i]
    if i < students.length-1
        output += ","
        
console.log(output)

上記の例では、まず配列studentsに「佐藤」「田中」「小林」の３つの文字列を格納しています。
その後、カウンタ変数iを0に初期セットし、配列studentsの要素の数に到達するまでループでiを1ずつ増やしてまわしていきます。その際に、console.log関数を使い、配列studentsのi番目の要素の値を出力し、最後の要素以外、その後に「,(カンマ)」を出力しています。

構造体の取り扱い

最後に構造体の取り扱い方法について解説します。

ここではエクセルのようなデータを作って、以下のようにデータを出力することにしましょう。

名前:佐藤,性別:男性
名前:田中,性別:女性
名前:小林,性別:女性

これを出力するコードは以下です。

first_row = "A": "佐藤", "B": "男性"
second_row = "A": "田中", "B": "女性"
third_row = "A": "小林", "B": "女性"
excel_data = [first_row, second_row, third_row]

for i in [0..excel_data.length-1]
    output = ""
    output += excel_data[i]["A"]
    output += ","
    output += excel_data[i]["B"]
    console.log(output)

上記の例では、まずfirst_row, second_row, third_rowという３つの連想配列を作り、それぞれのAというキー(列)に名前を、Bのキーに性別の値を入れていきます。
そして、それら全てをexcel_dataという配列に入れます。
その後、カウンタ変数iを0に初期セットし、配列excel_dataの要素の数に到達するまでループでiを1ずつ増やしてまわしていきます。その際に、console.log関数を使い、配列excel_dataのi番目の要素の中のA列とB列の値を出力しています。

まとめ：CoffeeScriptはとても書きやすく初心者に優しい言語

CoffeeScriptの良さを簡単にまとめると、以下のとおりです。

とても書きやすい ← 動的型付けとインデントによるブロック分けなど
JavaScriptとして使える ← JavaScriptがベース
Visual Studioが使える← IDEとしてVisual Studioが使用可能

つまりCoffeeScriptは、動的型付けやインデントによるブロック分け、変数宣言時のvarや末尾のセミコロンの廃止等により、とても書きやすくなった言語であり、かつ便利なIDEであるVisual Studioで開発することもできる、JavaScriptをベースにした言語ということになります。

フロントエンドの開発では直にJavaScriptで書かれることが多いものの、JavaScriptを学ぶ前の優しい入口として、CoffeeScriptを最初に学んでみる価値は十分にあります。

CoffeeScriptの将来性についてですが、最近JavaScript自体にも更新があり、ES6でクラスが使えるようになりましたので、書きやすさという点以外ではあまり魅力に感じない方も増えて来たのではないかと思います。

もともとCoffeeScriptはJavaScriptがES5でクラスの概念がなかった頃にクラスを導入したことで注目を集めました。

それに、わざわざコンパイルしないと動かないというのもTypeScript同様、面倒な点です。
将来性については慎重に見極める必要がありそうです。

CoffeeScriptは動的型付けで書きやすいように配慮されている言語なので、独学は可能だと思われますが、もし独学でできなさそうな方は、プログラミングスクールも手段の一つに入れると良いと思います。