情報処理のWeb教科書―IPA情報処理試験対策のお供に!

JavaScript―整数の割り算のあまりなど、四則演算から超入門テキスト

トップ プログラミング JavaScript

整数の割り算のあまりなど、四則演算から超入門をテーマにJavaScript入門用のオリジナルテキストをまとめています。

目次

この記事の目次です。

1. JavaScriptとは

2. ブラウザ

3. HTML

4. テキストエディタ

5. プログラムの作成と実行方法

6. 四則演算

7. 文字

8. 変数

9. データ型とリテラル

もっと知識を広げるための参考

更新履歴

1. JavaScriptとは

JavaScriptとは、ブラウザサポートされているプログラミング言語です。

専門的にいうとプログラミング言語としては、スクリプト言語、インタプリタ型言語、オブジェクト指向型言語に分類されるプログラミング言語です。 オブジェクト指向の型指定の弱いスクリプト言語といわれます。 ECMAScriptとして言語仕様の標準化が進められています。

プログラミング経験のない入門者としては、ひとまずブラウザで動かせるプログラムが作れる、プログラミング言語ということを覚えておけばよいかと思います。

2. ブラウザ

ブラウザは、ChromeやEdge、IE、Firefox、SafariなどのWebページを表示するためのソフトウェアです。 ブラウザには、マークアップ言語のHTMLを表示する機能やJavaScriptを実行するエンジンが標準搭載されています。

3. HTML

ブラウザでJavaScriptのプログラムを動かすときその呼出し元となるのがHTMLです。 HTMLはプログラミング言語ではなくマークアップ言語と呼ばれる言語です。

タグと呼ばれる「<」「>」で囲まれたマークを階層構造に記述して表現する言語です。 例えば、JavaScriptを記述する場合は以下のように「<script>」タグを記述します。

<script></script>

HTMLやJavaScriptはテキストエディタを使用して記述し、「.html」の拡張子のファイルに保存するのが基本になります。

4. テキストエディタ

テキストエディタは、テキストを編集することができるソフトウェアです。 Windowsには「notepad(メモ帳)」というテキストエディアがアクセサリとして標準搭載されています。

notepad

notepadの使い方について触れていきます。

起動方法

notepadはWindowsの左下のマークを右クリックして「ファイル名を指定して実行(R)」から「notepad」と入力して「OK」することで起動できます。

Windowsの左下のマークを右クリック
Windowsの左下のマークを右クリック
「notepad」と入力して「OK」
「notepad」と入力して「OK」
notepad(メモ帳)
notepad(メモ帳)

保存方法

保存方法は「ファイル(F)」から「名前を付けて保存」を選んで、「ファイルの種類(T)」で「すべてのファイル(*.*)」を選んで「sample.html」のように「.html」の拡張子をつけたファイル名で、保存します。 「文字コード(E)」は「UTF-8」を選んでおくとこの先トラブルが少ないと思います。

保存方法
保存方法

5. プログラムの作成と実行方法

JavaScriptのプログラムの作成とブラウザでの実行方法について説明していきます。

JavaScriptプログラムの作成方法

テキストエディタに以下のようにHTMLとJavaScriptのコードを記述して、「sample.html」のように「.html」の拡張子をつけたファイル名で、保存します。 以下はアラートダイアログに「1」という数字を表示する例です。

<script>
alert(1);
</script>

JavaScriptプログラムの実行方法

保存したhtmlファイルを右クリックして、「プログラムから開く(H)」より、ブラウザを選択して実行します。 以下はChromeで開いた場合のイメージです。

Chromeで開いた場合のイメージ
Chromeで開いた場合のイメージ

6. 四則演算

JavaScriptで整数の四則演算を行うプログラムについて説明していきます。

足し算

足し算は「+」を使用して行います。

<script>
alert(1+1);
</script>
JavaScriptで足し算を行ったイメージ
JavaScriptで足し算を行ったイメージ

引き算

引き算は「-」を使用して行います。

<script>
alert(1-1);
</script>
JavaScriptで引き算を行ったイメージ
JavaScriptで引き算を行ったイメージ

掛け算

掛け算は「*」を使用して行います。

<script>
alert(2*2);
</script>
JavaScriptで掛け算を行ったイメージ
JavaScriptで掛け算を行ったイメージ

割り算

割り算は「/」を使用して行います。

<script>
alert(5/2);
</script>
JavaScriptで割り算を行ったイメージ
JavaScriptで割り算を行ったイメージ

整数の割り算の余り

なお、整数の割り算の余りを「%」で求めることができます。

<script>
alert(5%2);
</script>
JavaScriptで整数の割り算の余りを求めたイメージ
JavaScriptで整数の割り算の余りを求めたイメージ

7. 文字

JavaScriptで文字を扱うプログラムについて説明していきます。

文字はシングルコーテーション(')で囲む

文字はシングルコーテーション(')で囲んで表現します。

JavaScriptで文字を表示する例

以下は、JavaScriptで文字を表示する例です。

<script>
alert('A');
</script>
JavaScriptで文字を表示する例
JavaScriptで文字を表示する例

8. 変数

JavaScriptの変数について説明していきます。

変数とは

プログラミングの世界では、変数というメモリの領域に名前を付けたものを使用して、データを一定期間記憶して必要なときに利用できる仕組みがあります。

変数の宣言

JavaScriptで変数を利用する場合、まず変数を宣言する必要があります。 変数を宣言することで、JavaScriptで利用するデータの格納領域を確保します。 変数を宣言する場合、次のように「var」キーワードを利用します。

var 変数名;

変数の初期化

変数宣言と同時に値を設定することもできます。 これは「変数初期化」と呼びます。 次に示すような変数宣言と代入文を組み合わせた書式になります。 代入は変数にデータを設定することで「=」を使います。以下はmessageという名前の変数の例です。

var message = "A";

JavaScriptで変数の値を表示する例

以下は、JavaScriptで変数の値を表示する例です。

<script>
var message = "A";
alert(message);
</script>

表示結果は文字の表示の例と同じです。

JavaScriptで変数の値を表示する例
JavaScriptで変数の値を表示する例

9. データ型とリテラル

データ型とは、プログラム内で取り扱うデータの値の形式、種類を表す用語です。「型(かた)」とも呼ばれます。 JavaScriptのデータ型は、値の格納方法の違いによって、「プリミティブ型」と「参照型」に分けられます。 また、データに記述する数値や文字列などデータそのものを表す「リテラル」があります。

プリミティブ型

プリミティブ型には「数値」「文字列」「論理値」に加え、特殊なデータ型である「Null」「未定義値」が含まれます。

参照型

参照型に含まれる「オブジェクト」とは、複数のプリミティブ型や参照型のデータの集合体です。 また、特殊なオブジェクトとして、データにインデックスを割り当ててまとめて取り扱う「配列」や特定の処理を取りまとめた「関数」があります。

リテラル

プログラム内に直接記述する数値や文字列の固定値の記法を「リテラル」といいます。 リテラルは、プログラム内で変数に代入するためによく利用されます。 たとえば、数値の123は「var val = 123;」というように記述し、文字列の123は「var val = "123";」と記述して区別されます。

もっと知識を広げるための参考

更新履歴

戻る

スポンサーリンク

情報処理の知識体系

プログラミング

各試験の問題と解説

ランダム出題・採点アプリ

スポンサーリンク