ソフトウェアとプログラミング言語

指導者向けの公開補足

学習本文に加えて、指導の視点・背景・授業での確かめ方を示します。どなたでも読めます。

指導の焦点

OSとアプリケーションを、使う場面だけでなく役割の違いで整理する。プログラム言語と、それを実行する環境も分ける。

一歩踏み込んだ背景

コンパイルとインタプリタは、言語を必ずどちらか一方に分類する札ではない。同じ言語でも実装によって実行前後の処理が組み合わされる。

授業での確かめ方

ファイル保存やプリンター出力に、アプリとOSがどう関係するかを説明させる。実行環境の違いで動作が変わる例は、言語の規則と分けて記録する。

制度・規格等は本文末尾の参考資料も確認してください。

JSFiddleでコードを試す

JSFiddleは、ブラウザーでHTML・CSS・JavaScriptを入力して実行できるサービスです。短い動作確認から始められます。

新しい編集画面を開きます。JavaScriptは通常のJavaScriptを選び、外部ライブラリは追加しません。
HTML欄にはページの本文、CSS欄には見た目、JavaScript欄には処理を書きます。HTML欄に<html>や<body>は不要です。JavaScript欄に<script>は付けません。
DOMを使う例では、JavaScriptの実行タイミングを「On Load」「On DOM Ready」または「No wrap - bottom of body」にします。
「Run」を押してResult欄を確認します。書き換えたら再びRunを押します。

console.logの結果は通常、ページではなく開発者ツールのコンソールに出ます。このサイトの計算例をResult欄で読みたいときは、HTML欄に次を入れます。

<pre id="output"></pre>

JavaScript欄には次を入れ、console.log(2 + 3);の行を、試したいコード一つに置き換えます。独立した例を複数まとめて貼らないでください。

{
  const output = document.getElementById("output");
  const console = {
    log(...values) {
      output.textContent += values.join(" ") + "\n";
    }
  };
  console.log(2 + 3);
}

Runを押すと「5」と表示されます。外側の波括弧の中だけで表示用のconsoleを用意しているため、ブラウザー本来のコンソールは変更しません。

HTMLとJavaScriptの両方を載せた実習例は、この表示用コードで囲まず、それぞれの欄へ分けて貼り付けます。保存・共有時は公開範囲を確認し、個人情報やパスワードを入力しないでください。コードは手元にも残しましょう。

NAS・GitHub・CodePenなど、作業環境の選び方

この単元でできるようになること

OSとアプリケーションの役割の違いを説明できる。
ソースコードと機械語、実行環境の関係を説明できる。
要件、設計、実装、テストを結び付けて改善できる。

目的の違うソフトウェアが協力する

ソフトウェアはプログラムやデータ、それらに関わる文書などを含む。ハードウェアという物理的な仕組みに対し、何をどう処理するかを表す側だ。架空の校内展示で、来場者の感想を文書にまとめる場面なら、文字の入力や見出しの編集は文書作成アプリケーションが担当する。

その背後ではOSが、CPUを使う処理の切り替え、メモリの管理、ファイルの保存、装置への入出力、利用権限の管理などを担う。アプリケーションが装置ごとの細部を全て直接操作しなくてもよいよう、共通の利用方法を提供する。装置に応じた制御を担うデバイスドライバも、この協力関係の一部である。

層	主な役割	感想を保存するとき
アプリケーション	利用者の目的に応じた処理	文の編集や保存の指示
OS	資源やファイル、権限の管理	保存先と書き込みの管理
ハードウェア	物理的な計算や記録	SSDなどに情報を記録

保存できない原因は、アプリの操作ミスだけとは限らない。容量不足、権限、保存先の指定など、異なる層の問題を切り分ける必要がある。原因の推測を記録し、一つずつ条件を変えるのが調査の基本だ。

ファイルは名前を付けて保存する情報のまとまりで、フォルダはファイルなどを階層的に整理する入れ物である。同じ名前でも別のフォルダなら違うファイルなので、場所を含むパスも確認する。拡張子は種類を判断する手掛かりになるが、名前を変えるだけで内容の形式が変換されるわけではない。

実行中のプログラムは、一般にプロセスという単位で管理される。複数のアプリが同時に見える場合も、OSが実行の機会や資源を割り当てている。処理の切り替えと、複数のコアによる実際の並列実行は同じ意味ではない。

人が書く言語と、実行する仕組み

CPUが直接扱う命令の表現を機械語という。高水準言語は、変数や条件分岐など、人が処理を組み立てやすい表現を提供する。低水準言語は機械の構成に近い操作を表しやすい。「高い」は品質や実行速度の順位ではなく、機械の細部からどれだけ離れて記述できるかという見方である。

人が書いたソースコードは、言語処理系によって実行可能な形へ変換・実行される。コンパイラは別の表現へ翻訳し、インタプリタはプログラムを解釈しながら実行する仕組みを指す。実際の処理系は両方の技術を組み合わせることがあり、「この言語は必ず一行ずつ翻訳する」と決めつけるのは適切ではない。

ブラウザにもNode.jsにもJavaScriptの実行環境がある。ただし、画面を操作する機能が全環境にあるわけではない。この章のコードは計算と表示に絞り、DOMや通信機能を使わない。それでも、異なる言語へそのまま貼れば動くという意味ではない。

要求を、確かめられる形にする

「展示の札を準備したい」だけでは仕様が曖昧である。「七つの展示に各二枚の札を用意し、予備三枚を加えた必要枚数を表示する」と決めれば、入力、処理、出力がはっきりする。要件は満たしたい条件、設計はその実現方法、実装は設計をコードにする作業、テストは期待と実際を比較する作業である。

const exhibits = 7;
const labelsPerExhibit = 2;
const spare = 3;
const required = exhibits * labelsPerExhibit + spare;
console.log(required);

出力は 17。実行前に手計算で期待値を決めておくと、プログラムの誤りを見つける基準になる。展示が零でも予備を三枚用意するのか、それとも全体を零にするのかは、プログラムからは決まらない。依頼の意図を確認して仕様に書く必要がある。

エラーを分類して直す

括弧の閉じ忘れなどは構文の誤りであり、実行に進めないことがある。存在しない名前の利用は実行時のエラーになることがある。一方で、予備を足す代わりに引く誤りは、実行が完了しても結果が不適切になる論理的な誤りだ。

修正では、症状を再現する小さな例を作り、原因の仮説を立て、変更後に同じ例で確かめる。正しい例を一つだけ通して終了せず、零、境界、大きな値も要件に合わせて試そう。変更前に正しかった例も再び確認すると、修正による別の不具合を見つけやすい。

注意： すべてのコンピュータが一般的なOSを必須とするわけではない。組込み機器などにはOSなしで動く仕組みもある。ここで扱う層は、通常の端末を理解するための基本モデルである。

用語

用語	意味
OS	資源や装置の利用を管理する基本ソフトウェア
アプリケーション	特定の利用目的に応じたソフトウェア
ソースコード	人がプログラミング言語で記述した内容
言語処理系	コードを変換・解釈し実行につなぐ仕組み
デバッグ	不具合の原因を調べて修正する作業

確認問題

文書の文字を大きくする機能と、保存先の書き込み権限の管理は、それぞれどの層の役割か。
例で展示を九つ、予備を四枚にしたときの期待出力を、実行せずに求めよう。
コードがエラーなく動いても、要件を満たすとは限らない理由を札の例で説明しよう。

問1の解答例を見る

文書の文字を大きくする機能は主に応用ソフトウェア、保存先への書き込み権限の管理はOSの役割である。応用ソフトはOSの機能を使ってファイルを扱う。

問2の解答例を見る

22。展示9個×1個あたり2枚＋予備4枚＝22枚となる。

問3の解答例を見る

たとえば必要な予備枚数や、一展示あたりの枚数を取り違えていれば、計算自体がエラーなく動いても必要な札がそろわない。仕様と期待結果に合うかを別に確かめる。