JavaScriptは、最も普及しているプログラミング言語です。

webブラウザに搭載されているため、iOSでも、Androidでも、Windows でも動きます。

この本では初めてプログラミングをされる方を対象とし、基本的なJavaScriptの書き方を解説します。

JavaScriptは初心者が最初に覚えるのにお勧めなプログラミング言語です。何かをダウンロードしたりインストールしたりすることなく、ブラウザだけで簡単にプログラムを作ることができるからです。また、国際標準化されたECMA Scriptに準拠しているため、仕様が安定しています。

この本で挫折した方は、Scratchなどの言語から始めることもご検討ください。

目次編集

進捗状況の凡例

  数行の文章か目次があります。
 :本文が少しあります。
 :本文が半分ほどあります。
 : 間もなく完成します。
 : 一応完成しています。
  1. はじめに   (2017-01-26)
  2. 変数   (2017-01-26)
    1. ※ 参考: 演算子   (2017-01-26)
    2. ビット演算   (2016-02-19)
  3. 文字列   (2016-02-19)
  4. 数値   (2016-02-19)
  5. 配列   (2016-02-19)
  6. 制御構造   (2016-02-19)
  7. 関数   (2016-02-19)
  8. イベント処理
  9. オブジェクト   (2016-02-19)
  10. クッキー
  11. ファイル入出力の機能は無い(詳しくは後述
  12. 正規表現   (2016-02-19)
  13. 例外処理   (2016-02-19)
  14. DOM   (2016-02-19)
  15. JSON   (2016-02-19)
  16. XML   (2016-02-19)
  17. XMLHttpRequest   (2016-02-19)
  18. リファレンス
    1. Global   (2016-02-19)
    2. Array   (2016-02-19)
    3. Boolean   (2016-02-19)
    4. Date   (2016-02-19)
    5. Function   (2016-02-19)
    6. Math   (2016-02-19)
    7. Number   (2016-02-19)
    8. Object   (2016-02-19)
    9. RegExp   (2016-02-19)
    10. String   (2016-02-19)
    11. Error   (2016-02-19)
      1. EvalError   (2016-02-19)
      2. RangeError   (2016-02-19)
      3. ReferenceError   (2016-02-19)
      4. SyntaxError   (2016-02-19)
      5. TypeError   (2016-02-19)
      6. URIError   (2016-02-19)
JavaScript/画像表示

無い機能編集

ファイル入出力は無い編集

上記の目次に、ファイルへの書き込みなどの、「ファイル入出力」に関する単元が上記の目次に無いのに気づいただろうか?

実はセキュリティなどの理由から、一般的なwebブラウザ上では、JavaScriptによるファイル操作のプログラムが動作しないようになっている。

サーバーなど、webブラウザ以外の環境でしか、JavaScriptによるファイル操作のプログラムは動作しない。また、一般にサーバー側でプログラムを書く場合には、PHPPerl などといった、JavaScript以外のプログラミング言語が用いられる。

このため、本wikiの本科目では JavaScript によるファイル操作のプログラムは扱われない。


ただし、Windows限定だが、JavaScript風のスクリプト言語であるJScript(ジェイスクリプト)というのが、実はコマンドプロンプト(DOSプロンプト)から起動できるようになっているので、これを使うと、webブラウザを経由しないので、ファイル入出力などのファイル操作も可能である。しかし、JScriptでは、web部ブラウザ用の標準の命令が使えないし、GUI的な機能もほぼ無い(簡単なテキスト処理や、初歩の数値計算などがJScriptなどで可能)。

JavaScript/JScript (Windows限定)

クラスはES5以前は無かった編集

2015年からのES6(ECMAScript)で、JavaScriptにクラスの機能が追加された。(Java や C# という言語には、クラスという機能がある。そのクラスと類似の機能が JavaScriptにも追加された。)

それ以前のもともとの古い JavaScript にはクラスの機能は無い。

たとい読者がクラスを知らなくても、一般的なwebページを作るぶんにはクラス機能は利用しないのが通常なので、一般的なJavaScriptの用途では、特に問題は無い。


派生言語編集

TypeScript編集

TypeScript(タイプスクリプト)という、JavaScriptの各種の構文に型を追加した派生言語にある。

TypeScriptの用途としては、型システムがあるためにコンパイラが実行前の段階でもバグを自動的に発見しやすいという長所があるので、大規模開発のwebアプリで TypeScript が用いられる場合もある。


だが、一般にウェブブラウザの言語としては TypeScript は採用されていない。

そのため、もし TypeScript の命令をブラウザで表示など実行したい場合、別途、TypeScriptコンパイラによるJavaScriptへの変換(これも「コンパイル」という)が必要であるが、しかしこれだけでは、まだHTMLタグが無いので表示しない。

つまり、TypeScript には HTML関連タグの生成・管理の機能は一般に無い。

なぜなら TypeScriptのコンパイラ(TYpeScript→JavaScript)の機能は、けっしてHTMLの組み込み用に自動変換したりする機能ではなく、素の JavaScript の文法どおりに変換する機能である。

※ 本書のJavaScriptの入門レベルの解説では、説明の都合上、HTMLタグと組み合わせての形式で、ブラウザですぐに実行表示できるような形式でほとんどの JavaScript のコードを掲載しているが、実はもともとの国際規格上では、HTMLタグの規格 と JavaScriptの規格 とは別規格である。(おそらく実務上は、お互いに連絡しあっているだろうが、しかし、あくまで別規格。)
なので、べつにTypeScriptが特別にHTMLを除外しているワケではなく、あくまで、もともとJavaScriptというのは文法上はHTMLとは独立したものである。

派生フレームワーク編集

JavaScript用のライブラリで、便利な関数などをまとめたライブラリを提供している企業・コミュニティがいくつかある。

そのような企業・コミュニティなど提供のJavaScript用のライブラリが、俗にJavaScript用の「フレームワーク」と言われる。

こういう派生フレームワークは、JavaScriptの公式コミュニティの開発ではないので、JavaScript公式によるサポートは無い。(代わりに、それぞれのフレームワークの開発コミュニティなどがサポートしている。つまり、フレームワークの開発コミュニティは、JavaScriptの開発コミュニティとは、別団体である。)


HTML4時代の2005~2010年の古くはjQuery(ジェイクエリ) というフレームワークが有名であったが、(また Ajax (アジャックス)というツールが jQuery によく対応していた)

しかしHTML5時代になり、jQueryはHTML4を前提とした構成のため、競争相手としてTML5対応を謳った新たなフレームワークも登場してきており、下記の3つのフレームワークが有名である。

代わりに

Angular (アンギュラー) ※ 詳しくは w:Angular
React (リアクト) ※ 詳しくは w:React
vue.js (ビュー・ジェイエス) ※ 詳しくは w:vue.js
※ 掲載順はアルファベット順

という新興のJavaScriptフレームワークが、2010年以降のHTML5時代から台頭してきている。

しかし2020年の現状では依然としてjQueryが業界で大普及しているのが実情である。jQuery自身も更新により、HTML5対応のブラウザやサーバーでも問題なく動作する。

なおAngularのプログラム言語は、正確には (JavaScript ではなく) TypeScript である。w:TypeScript

またなお、Node.js はフレームワークではなく、( Node.js は)実行環境です。

また jQueryの問題点はHTML5以前を引きずっているかどうかだけでなく $(document).ready(function(){のような構造の分かりづらい、jQuery命令群の命名規則もある(たとえば、例の$なんとかの命令の場合、丸カッコの左「(」が3個なのに、丸カッコの右「)」は2個である。

こういったコードを書いたあと、jQueryの命令文を書き、最後に}); で終了するので、結果的に丸カッコの左右の個数が一致するという仕組みである。(JavaScript以外の派生フレームワークでも、たとえばPHPの有名な派生フレームワークのひとつ Laravel でも同様に }); で終了するコードがよく出て来るので、プログラマーはこういう記法にも、なれるしかない。)


なおjQueryの「$」記号は実は単なる関数名「$」である。JavaScriptでは関数名に「$」記号を使うことは禁止されていない。JavaScriptのテンプレートリテラルでも同じ$記号を使うが、しかしjQueryの$記号はテンプレートリテラルとは無関係である)。

このほか、jQueryにはオブジェクトとメソッドのあとに、さらにメソッドがつくという、メソッドチェーンという記法も良く使われる。(なおjQueryを導入していない一般のJavaScriptでもメソッドチェーン自体は存在している。)

こういう記法の意味の把握の難しさはjQueryだけでなく、jQuery以外の Angular / React / vue.js といった他のフレームワークでも、それぞれ難しい部分の場所の違いはあれど、なぜか記法の各所で紛らわしい部分があったりして、なかなかヤヤコシイのが実情である。

派生フレームワークはプログラミング言語ではなく、あくまでJavaScriptのライブラリでしかないのだが、しかし上述のどの派生フレームワークも、なぜか設計思想としてプログラミング言語的な記法を目指している方針のようである。そのため、どのフレームワークでも、JavaScript側の文法と、フレームワーク側の記法との接触する箇所で、文法(?)というか記法が、まぎらわしくなっている。

HTML5対応を謳っていてもいなくても、JavaScript用の上述の4つのどの有名フレームワークも、記法のまぎらわしさが、何も解決していない。


未分類編集

クッキー編集

PHPのクッキー作成の関数である setcookie() で作ったクッキーは、

JavaScript の document.cookie; では読み込めない。


参考文献編集

外部リンク編集

ウィキペディアJavaScriptの記事があります。