はじめに

　JavaScriptは今後成長が期待される、とても良いプログラミング言語です。現時点でもすでに、ウェブアプリ・モバイルアプリ・デスクトップアプリやサーバー開発に強みがあります。いろいろなカテゴリの言語がJavaScriptに集約しつつある現代においてJavaScriptはプログラマの最強の武器です。

　しかし、読者の皆様はJavaScriptと聞くと「え？今更？」といった印象をお持ちの方も多いと思います。しかし、現代のJavaScriptは以前のそれとは完全に別の言語になっており、他の新しい言語に負けない強力な言語です。以前のJavaScriptにとらわれず、最新のものを覚えるだけで簡単に現代的なJavaScriptの力を引き出すことができます。本書ではそのようなモダン（現代的）なJavaScriptへのショートカット方法をお伝えします。

　最新の言語仕様、Node.jsおよびnpmエコシステム、ユニットテスト。これらを覚えれば、あとは幅広く応用が利きます。この一冊があればモダンなJavaScriptを活用することができるのです。

対象読者

　本書の対象読者はなんらかのプログラミング言語を身に着けている人です。特にRuby/Python/PHPなどのスクリプト言語に慣れていると馴染みやすいと思います。何かの言語を覚えてJavaScriptを2つめ¹の言語として覚えるということを想定しています。

　そのため、本書ではプログラミングとは何か？という説明はいたしません。プログラミングそのものが分からない人は、何らかの入門書やウェブの解説を読んでからの方がいいでしょう。ドットインストール²はプログラミング初心者にもお勧めのサイトです。

なぜJavaScriptなのか？

　では、なぜJavaScriptなのでしょうか？もともとJavaScriptはウェブの初期に一世を風靡したNetscape Navigatorというウェブブラウザに搭載されたスクリプト言語です。そのために多くの人にとっては、ウェブブラウザ上で動いてページに動きをつけたりするような限定的な言語というイメージが強いかもしれません。今更JavaScript?って思ったりするのではないでしょうか？本書ではその間違った古いイメージを払拭します。

生まれ変わったJavaScript/ECMAScript

　著者がJavaScriptをお勧めできるようになった最大の理由が、その言語仕様が大きく生まれ変わったことです。古いJavaScriptは、他の言語にはあまり見られない不思議な要素が多く存在しており、普通にプログラムを書くにも黒魔術めいたトリックが必要になってしまうという、とてもいびつなものでした。

ところが2015年に、待ちに待った新しい言語仕様であるECMAScript 2015が登場してからは状況が大きく変わりました。

　ECMAScript2015はオーソドックスなオブジェクト指向プログラミングと、関数型言語のエッセンスなどを備えた現代的なマルチパラダイム言語です。

Node.jsとnpmエコシステム

　Node.jsは、JavaScript/ECMAScriptのコマンドラインで動く処理系で、npm³はNode.jsのパッケージシステムです。Node.jsが登場するまでは、JavaScriptはウェブブラウザの力を借りないと何もできませんでした。たとえばユニットテストもウェブブラウザ上で動かすのが当たり前でした。画像の加工、CSSの処理などもRubyなど他の言語の力を借りることも多かったのです。

　Node.jsが登場し、スクリプト言語として使えるようになってからはJavaScriptで書かれたいろいろなツールが登場するようになりました。今ではウェブ開発に関して大抵のものがJavaScriptで書かれるようになっています。エコシステムがしっかりしてきているのです。

　実際にJavaScriptはサーバー、それも世界のトップクラスのサーバーで使われる立派な言語になりました。JavaScriptが使われている有名な事例としてはTwitterモバイルが挙げられます。Twitterは当初、世界最大のRuby on Railsアプリケーションでした。次にScalaへ移行してから長らくScalaを広く使っていたのですが、モバイル向けウェブサイトをJavaScriptに移行したのです。現代のウェブサイトのアクセスの半分はモバイルだといわれています。全部を置き換えたわけではありませんが、Twitterモバイルでの採用というのはインパクトのあるケースです。

さまざまなものに組み込まれるJavaScript/ECMAScript

　JavaScriptはさまざまなものに組み込まれています。古き良きMacromedia FlashもJavaScriptベースであるActionScriptが組み込まれています。人気のKVSであるMongoDBもクエリ言語としてJavaScriptが組み込まれています。他にもいくつかのゲームやゲームツールにJavaScriptや類似言語が組み込まれていますし、デスクトップアプリを簡単に作るElectronにも組み込まれています。今後もこの傾向が続き、いろいろなものにJavaScriptが組み込まれることになるでしょう。

JavaScriptをもっと知ってもらうために

　ここまでに書いたようにJavaScriptは、とても良い言語に生まれ変わりました。またNode.jsとnpmによるエコシステムも非常に強力ですし、さまざまなところでJavaScriptが使われ、今後もその傾向は続くでしょう。Githubのトレンドなどを見てもJavaScriptの人気は衰えることがなさそうです。

　しかし、現在他の言語を触っているエンジニアの中には、スキルが今のJavaScriptにマッチするにもかかわらず、まだ手を出してないという方がそれなりにいるのでは？と思っています。それはもったいないことです。Web上などの情報にはまだまだ古いJavaScriptの残滓が残っているので、本書を通じてモダンなJavaScriptについて知っていただければ嬉しいと筆者は考えています。

　みなさんも是非JavaScriptのパワーを生かして、開発力をさらにブーストしてみませんか？皆さんのお役に立てれば、筆者としてはうれしい限りです。

サンプル

　リスト1はNode.jsで動く簡易的なCSVパーサーです⁴。CSVクラスを定義してそのインスタンスを生成してメソッドを叩くという、オブジェクト指向プログラミングでよくあるソースですね。

リスト1: ECMAScriptで書いた簡易CSVパーサー

 1: const fs = require('fs')
 2:
 3: class CSV {
 4:   constructor(delimiter = ',') {
 5:     this.delimiter = delimiter
 6:   }
 7:
 8:   parseFile(filename) {
 9:     const file = fs.readFileSync(filename).toString()
10:     const lines = file.split('\n')
11:     return lines.map(line => line.split(this.delimiter))
12:   }
13: }
14:
15: const csv = new CSV()
16: const result = csv.parseFile('test.csv')
17: console.log(result)

　CSVクラスはnewでインスタンスを生成するときに区切り文字を指定することができますが、省略するとカンマが使われます。parseFileメソッドでは指定したファイルから中身を読み出して、行で区切ってからさらにデリミタで区切ります。

本書のサポート

　https://rabbit-house.tokyo/books/javascriptにて本書のサポートを行います。感想や間違いの指摘などございましたらerukiti@gmail.com宛までメールを送るか、https://twitter.com/erukiti宛にメンションを飛ばすなどしていただけたら幸いです。

表記関係について

第1章　JavaScript解説

　第1章では言語仕様であるECMAScriptと主な利用用途の過去と現在について触れ、序章で述べた古いイメージからの脱却を図ります。

1.1　ECMAScript

　ECMAScriptはJavaScript¹から言語仕様だけを抜き出した規格で、ブラウザのAPIであるDOMと言った余分なものをとりのぞいたものです。一般的にECMAScriptと呼ぶときは言語仕様の話をしたいのだと理解してください。ECMAScriptは、Ecma Internationalという情報通信における世界の標準規格を作ってる団体によって定められているECMA-262²という規格です。（同様にＣ♯もECMA-334³という規格になっています。）

　さて、2009年に制定されたECMA-262第5版（通称ES5）は長い間使われてきましたが、ES5までのECMAScriptは他の言語にはあまり見かけられない独特な仕様を持っていました。たとえば、オブジェクト指向言語としてのクラスはあるものの、リスト1.1のようにプロトタイプを定義する、といった独特な方法を採ります。他にもJavaScript初学者の大きな壁であるthisや関数スコープなどの特殊な仕様に苦しめられた人が非常に多く、いくつもの黒魔術めいたバッドノウハウ⁴が当たり前のように使われていました。

　リスト1.1: ES5までのコード

1: // クラスHogeのコンストラクターとなる関数の定義
2: function Hoge() {
3:   this.hoge = 'hoge'
4: }
5:
6: // クラスHogeのメソッド定義
7: Hoge.prototype.fuga = function (){
8:   console.log(this.hoge)
9: }
10:
11: var hoge = new Hoge()
12: hoge.fuga() // -> hoge

　しかし、2015年にECMAScript 2015（ES2015⁵）という仕様が決まってから、現代的で実用に耐える言語になりました。リスト1.2のように素直なクラス定義ができるようになる、変数定義がブロックスコープになる、ラムダ関数のアロー表記が使えるようになる、など数え切れない程の改善が加えられています。

リスト1.2: ES2015以降のコード

1: class Hoge {
2:   // コンストラクターの定義
3:   constructor() {
4:     this.hoge = 'hoge'
5:   }
6:
7:   // メソッドの定義
8:   fuga() {
9:     console.log(this.hoge)
10:   }
11: }
12:
13: const hoge = new Hoge()
14: hoge.fuga() // -> hoge

プロトタイピングベースのOOPとは？

　「ECMAScriptはプロトタイピングベースのオブジェクト指向言語である」という主張を耳にします。しかし、ECMAScriptはさまざまな言語から影響をうけたマルチパラダイムな言語であるため、これはあまり意味がありません。ECMAScriptはオブジェクト指向言語だけではなく関数型のエッセンスも混じったものです。ScalaやSwiftなど、最近人気のある新しい言語はこのようなマルチパラダイムのものが主流です。ES5までの古いJavaScriptではプロトタイプベースというのが大きな呪縛になっていましたが、ES2015以降のモダンなJavaScriptで開発を行う際にはプロトタイプということを忘れてもかまいません。前記のような記事は信用ならないものを思っていいでしょう。

目次