1.1 はじめに

(1/1)
JavaScriptプログラミング入門シリーズ概要
大きな写真大きな写真
(1672×941 ピクセル, 135 Kbyte)
プログラムとは何だろうか。まず言葉の定義を確認しておこう。
プログラム 【program(me)】
①番組。予定。計画。
②目録。計画表。また、演劇・音楽会などの内容を解説した小冊子。
③コンピューターに対して、どのような手順で仕事をすべきかを、機械が解読できるような特別の言語などで指示するもの。
『広辞苑』第七版より
スマートフォンのアプリのイラスト
このシリーズでは、③の意味のプログラムを作ることを学んでいく。

プログラムは、パソコンやスマホ、タブレットなどのアプリそのものである。また、スマートスピーカーやデジカメ、ドローンといったIT機器や、テレビ、冷蔵庫、エアコンなどの家電製品、自動車や飛行機といった大型機械、ワイヤレスヘッドホンやICカードの中にも入っている。現代人の生活とプログラムは切っても切れない関係にある。
プログラミングをする人のイラスト(女性)
このシリーズは、これからプログラムに関わる仕事に就く方、趣味としてプログラムを作ってみたい方を想定して書いている。
プログラムを作るにあたって費用をかけずに、当サイトからファイルをダウンロードするだけで学習できるように配慮したつもりである。
プログラムはプログラミング言語を使って書くものだが、世の中には数多くのプログラミング言語がある。ここで使うプログラミング言語は1つだけだが、学んだ内容は他の言語にも応用できるようにしたつもりである。(「コラム:プログラム電卓」参照)
また、中級者の方向けに、本文の後半で「読みやすいプログラム」の書き方を、「コラム」としてJavaScript内部の詳しい動きや文法、コンピュータの歴史などを記載している。読みものとして楽しんでいただければ幸いである。

目次

用意するもの:WindowsやMacの場合

JavaScript
このシリーズでプログラムを作って実行するのに必要なものは、お手持ちのパソコン、スマホ、タブレットだけだ。プログラミング言語を買ったりダウンロードしたりする必要はない
このシリーズでは JavaScript (ジャバスクリプト)  というプログラミング言語を使うが、これはブラウザの機能として備わっている。つまり、WindowsパソコンでもMacでもLinuxパソコンでも、AndroidでもiPhoneでも動かすことができる。
あとは、プログラムを書くためのテキストエディタがあればいい。Windowsなら「メモ帳」、Macなら「テキストエディット」で十分だ。ただし「テキストエディット」は、メニューの「フォーマット」から「標準テキストにする」を選んでから入力する。Wordなどのワープロ・ソフトは、文字の飾りや書式の情報が一緒に保存されてしまうので使わない。
また、終盤で学ぶネットを使ったプログラム以外は、ネットに接続していなくてもプログラムの作成と実行ができるようにしてある。

用意するもの:Androidの場合

QuickEditテキストエディター
スマホの場合、クラウドサービスとして提供されている開発環境や、作成したファイルをクラウドに保存するアプリがあるが、ここではWindowsやMacと同様、ローカルドライブに保存してブラウザで動作させるというオーソドックスな方法を紹介する。
この種のエディタは色々あるのだが、無料で利用でき、機能がシンプルなものとして「QuickEditテキストエディター」を紹介する。
QuickEditテキストエディター
インストールしたら、右上のフォルダ・アイコンをタップし、新規作成を選び(左上図)、これから紹介するプログラムを入力する。もしくは、ダウンロードしたHTMLファイルを開き、編集する。
入力できたら、下方にあるフォルダ・アイコンをタップし、ファイル名を指定して保存する。

つづいて、Files by Googleアプリを使って、保存したファイルをタップする。拡張子 .html にはChromeブラウザが関連付けられているので、入力したJavaScriptが実行される。
うまく動かないときは QuickEdit に戻って修正して保存し、Chromeブラウザでリロードする。この繰り返しである。

サンプル・プログラムの文字エンコードについて

この連載では、各節で、サンプル・プログラムを無償でダウンロードできるようになっている。
プログラム・ファイルの文字エンコードは、現在、WebサイトやWebアプリで標準的に用いられる UTF-8 で、改行コードは LF にしている。前述のメモ帳やエディタは、いずれも UTF-8 に対応しているが、もしダウンロードしたファイルが文字化けするようだったら、メモ帳やエディタの設定を見直してほしい。
なぜ UTF-8 を使うのかについては、「UCS と UTF - 文字コード」を参考にしていただきたい。

プログラムの利用、ご質問・ご意見は

このシリーズでダウンロードできるプログラムは無償だ。
自己学習の範囲内で利用する分には、自由に変更してもらって構わない。ただし、利用した結果、何らかの損害が発生しても当方は責任を負えないので、あらかじめご了承願いたい。
また、学校や企業内などで2次利用したいときは、「リンク・二次利用について」をご覧いただきたい。

内容に関するご質問、こんなテーマを取り上げて欲しいなどのご意見があれば、Blueskyアカウントをお持ちの方は パパぱふぅ@𝙥𝙖𝙝𝙤𝙤.𝙤𝙧𝙜 へお寄せいただきたい。お持ちでない方は、各ページの右下にあるリンク「こちらへお願いします」をクリックしてほしい。
これらコミュニケーションは他の利用者の参考にもなるので、とくに事情がないかぎり、ネット上でオープンにやり取りさせていただきたい。

おすすめの参考書

表紙 独習JavaScript 新版
著者 CodeMafia 外村 将大
出版社 翔泳社
サイズ 単行本
発売日 2021年11月15日頃
価格 3,278円(税込)
ISBN 9784798160276
参考書を読みながら学習を進めたいという方にお勧めなのが本書だ。「解説→例題(サンプル・プログラム)→理解度チェック」の繰り返しで、初心者から経験者までJavaScriptの理解度を深めることができる。
著者は、ソフトバンクの社内システムの開発を経て、CodeMafia のハンドルネームで Udemy などのプログラミング講師として活動している外村将大 (とのむら まさとし) さんである。

コラム:テキストエディタのすすめ

WZ EDITOR
WZ EDITOR
マイクロソフト Visual Studio やオープンソースの Eclipse (イクリプス)  のような統合開発環境(IDE)にはプログラム・エディタが付属している。プログラムの入力からデバッグまで、さまざまな機能が付いた便利なエディタだが、その開発環境が想定する言語やプロジェクトの形式に合わせて作られているため、どんなファイルでも同じ操作で扱えるわけではない。
私はパソコン上で、FORTRAN、BASIC、COBOL、Pascal、Smalltalk、Lisp、Prolog、C、C++、C#、Java、JavaScript、PHP、Ruby、Python‥‥数え切れないほどのプログラミング言語に関わってきた。言語によってプログラム入力操作が異なると生産性が落ちるので、VZ EDITOR という市販の汎用テキストエディタを使ってきた。現在は WZ EDITOR という名前で販売されており、30年以上の付き合いになる。
本シリーズだけでなく、ぱふぅ家のホームページもすべて WZ EDITOR で書いている。

みなさんも、ご自身が使いやすいテキストエディタを1つ見つけておいてはいかがだろうか。

コラム:システム開発とプログラム開発

再び広辞苑を調べてみよう。
システム【system】
複数の要素が有機的に関係しあい、全体としてまとまった機能を発揮している要素の集合体。組織。系統。仕組み。
『広辞苑』第七版より
システム開発とプログラム開発
システム開発とプログラム開発
今日のシステムは、様々なIT機器がネットワークを介して有機的に結合しているが、これを図示したものが上の絵である。
ここで注意してほしいのは、それぞれのIT機器は、その役割・機能に適したプログラミング言語でソフトウェアが構築されていることだ。たとえば、アプリケーションサーバ(クラウドサービスと呼ばれるものを含む)は PythonPHPJava などで、データベースは SQL で、人工知能は PythonR 言語で、ドローンなどのIoT機器は C++ 言語などでソフトウェアが書かれている。
ここで学ぶ JavaScript は、システムの中の一部――スマホやパソコンといったクライアント・プログラムを書くのに適したプログラミング言語である。

この連載では、JavaScriptを使ったプログラミングを通じてアプリケーションサーバやデータベース、人工知能の基礎技術に触れることはあるが、JavaScriptだけではこれらすべてのシステムを開発できないことを、あらかじめ承知しておいてほしい。
かといって、すべての言語を一度に学ぶというのも現実的ではない。どれか1つの言語を修めてから他の言語の習得に進むのが常道である。
また、1人の人間の能力には限界があるから、システム全体を独力で開発できるフルスタックエンジニアになるのは非常にハードルが高い。仕事では、それぞれの言語が得意なエンジニアが集まってチーム開発することがほとんどである。
ここでは、システム開発の登竜門としてJavaScriptを学んでほしい。

コラム:JavaScriptの商標

JavaScript は商標登録されているため、言語仕様は1997年(平成9年)から ECMAScript という名前で標準化されている。ECMAScript は言語仕様につけられた名前、JavaScript はその仕様にもとづく言語の呼び名で、指しているものはほぼ同じである。

JavaScript は、1995年(平成7年)、Netscape がサン・マイクロシステムズと提携して自社ブラウザのスクリプトとして開発したものだが、その名称の商標はサン・マイクロシステムズが登録・保有した。2010年(平成22年)1月、そのサン・マイクロシステムズが Oracle に買収されたことで、商標権は Oracle に移った。
Node.js と Deno の作者であるライアン・ダール氏は、これまでに2回、2022年(令和4年)9月と2024年(令和6年)9月に Oracle に対して JavaScript の商標を手放してほしいと公開書簡で呼びかけていた。

JavaScriptランタイム「Deno」の開発元であるDeno Landは、2024年(令和6年)11月22日、Oracleが所有する JavaScript の商標登録の取消を米国特許商標庁(USPTO)に請願し、同月25日に公表した。しかし、Oracle からは自主的に取り下げるつもりはないという返答だった。

2025年(令和7年)6月18日、米国特許商標庁の商標審判部(TTAB)は、Deno Landの主張のうち「Oracleは商標更新の際に無関係な Node.js の画面を使用証拠として提出した」という点については退ける判断を示した。一方、「JavaScript はすでに一般名称になっている」「Oracle は商標を放棄している」という2つの主張については審理が続いており、2025年(令和7年)9月から証拠開示手続に入っている。

参考サイト

(この項おわり)
header