10分で把握！JavaScriptスタートガイド
今回は、プログラミング言語の中でも、人気の高いJavaScriptに関して、初めての方 or 入門編を再度復習したい方向けに素早く把握できるようにまとめてみました。
スポンサーリンク
目次
JavaScriptとは？
クロスプラットフォームに対応したオブジェクト指向の軽量なスクリプト言語です。
主にWebブラウザでは、動きの部分を担当、例えば、ボタンをクリックしたイベントを受け取ったり、アニメーションのような動作をつける部分で利用します。
頭文字が一致しますが、「Java」のようなコンパイル言語とは、別の言語となります。
ECMAScript（エクマスクリプト）
複数のブラウザベンダーによる独自開発が進み、互換性が下がったことで、
Ecma Internationalのもとで標準化手続きが行われています。
JavaScriptはECMAScriptの仕様に基づいた言語のひとつという位置づけになります。
他にも「ActionScript」や「JScript」もECMAScriptの規格に基づいている。
バージョンに関して
ECMAScript2016(ES7)が、2016年6月にリリース。
次回、ECMAScript2017が（現在:2017/4/1）策定中です。
近年では、約1年単位くらいで更新がかかっている印象です。
気をつけたい点
ECMAScriptの仕様に基づいて、利用できる構文もモダンになってきています。
ただし、いくつもあるブラウザが全て、バージョンアップに適応できていないため、（例）「Google Chrome」では動いたけど、「Safari」では動作しなかったということがあります。
互換性に関しては、以下で対応状況が確認できます。
※左上タブで、バージョンが切り替わります。
※緑:対応済み/対応が進んでいる、赤:対応できていない
トランスパイラ
互換性の問題から脱却するため、トランスパイラ（変換ツール）に「Babel」「TypeScript」などがあります。
↑Babel公式サイト
Babelに触れておくと、主にツールでは、ES6で書いたコードのファイルをES5に変換してくれます。
プログラム自体は、新しいバージョンで開発し、バージョンダウンしたコードを利用すれば、対応ブラウザを増やすことができますね。
JavaScript始めよう
ここからは実際に手を動かして、JavaScriptを動かしてみましょう。
初めてということで、「Hello!!JavaScript!!」を表示してみましょう。
htmlファイルを準備
コマンドライン or Atomなどのエディタを使って、以下のようなファイルを用意する。
$ vi index.html
// ファイル中身コピペ
<html>
<head>
<title>JavaScript!始めた!</title>
</head>
<body>
<script type="text/javascript">
document.write("Hello!!JavaScript!!");
</script>
</body>
</html>
出来上がったファイルをChromeなどで開けば、完了です。
補足説明
htmlの
タグ内部にjavascriptを仕込みました。
// javascript定義方法
<script type="text/javascript"></script>
// ブラウザに文字を表示する方法
document.write("Hello!!JavaScript!!");
今回は、htmlファイルにjavascript処理も埋め込みましたが、[.js]を拡張子として外部ファイルに定義することで、記述を分けたりすることができます。
// 例 <script type="text/javascript" src="<読み込ませたいファイル名>.js"></script>
まとめ
JavaScriptは、環境を構築したり手間な事前作業がなく、手軽にスタートすることができます。
プログラミングの手法も、C / Javaに比べたらプログラミング未経験の方でも覚えやすい言語だと思います。
また、Webブラウザ・ストアアプリなど、利用される場所が多いため、今後も人気の言語の1つとなると思います。