【地区別③】GASの活用　基本的プログラム

前回は、GoogleClassroomによるGASファイルの配信方法について紹介しました。

これ以降の記事では、高校のプログラミングの授業でGASを利用することを想定し、授業で使えそうなネタを検討していきます。

今回は、基本の順次・分岐・反復について。

はじめに

使用する教材

全国30万の情報科教員の必読書『高等学校情報科「情報Ⅰ」教員研修用教材 第３章 JavaScript版』を参考にします。

教材はこちらの文科省のページからダウンロードできます。

今回の記事では、JavaScript版の P20-24 の内容を扱います。

プロジェクトの準備

実習用のプロジェクトを作成しましょう。

スプレッドシートのコンテナバインドスクリプトを作成します。

スプレッドシート名、プロジェクト名は任意です。例ではプロジェクト名を「基本的プログラム」としました。

順次

順次の例

研修用教材JavaScript版 P22

図表5、図表6の内容をコードに置き換えたのが図表7です。GASで記述しましょう。

すでに myFunction() がありますが、削除して書き換えましょう。

function zuhyo7 () {
  console.log('おはよう');
  console.log('こんにちは');
  console.log('おやすみ');

}
// --- 結果 ---
// おはよう
// こんにちは
// おやすみ

実行すると上から下に実行されていることが確認できます。

ちなみに、同じような内容の行をコピペするときは「 Shift + Alt + ↓ 」のショートカットが便利です。

演習２

＜演習２＞ 図表 7 のコードにおいて，「こんにちは」と「おやすみ」の間に「こんばんは」と表示されるようにプ ログラムを追加しましょう。

myFunction() の下に新しい関数 enshu2 () を追加し、その中にコードを書きます。

演習２のコード

function enshu2 () {
  console.log('おはよう');
  console.log('こんにちは');
  console.log('こんばんは');
  console.log('おやすみ');
}
// --- 結果 ---
// おはよう
// こんにちは
// こんばんは
// おやすみ

GASでは、スクリプトを実行する際に必ず関数を指定します。「デバッグ」ボタンの右のリストから実行したい関数を選択し、「実行」ボタンを押しましょう。

ちなみに、実行のショートカットは「 Ctrl + R 」です。

分岐

分岐の例

研修用教材JavaScript版 P22-23

図表8、図表9 の内容をコードに置き換えたのが図表10 です。GASで記述しましょう。

enshu2 () の下に下に新しい関数 zuhyo10 () を追加し、コードを書きます。 zuhyo10 () を選択し、実行しましょう。

function zuhyo10 () {
  const x = 80;
  if (x > 60) {
    console.log('合格');
  }
  else {
    console.log('不合格');
  }
}
// --- 結果 ---
// 合格

演習３

＜演習３＞

（1）図表 10 のコードにおいて，x の値だけを変更して「不合格」と表示されるようにプログラムを変更しましょう。

（2）図表 10 のコードを参考に「30 点未満ならば『再試験』そうでなければ『合格』と表示される」プログラム を作成しましょう。

(1)を enshu3_1 ()、(2)を enshu3_1 ()とします。

function enshu3_1 () {
  const x = 50;
  if (x > 60) {
    console.log('合格');
  }
  else {
    console.log('不合格');
  }
}

function enshu3_2 () {
  const x = 29;
  if (x < 30) {
    console.log('再試験');
  }
  else {
    console.log('合格');
  }
}

反復

反復の例

研修用教材JavaScript版 P23-24

図表11、図表12 の内容をコードに置き換えたのが図表13です。GASで記述しましょう。

新しい関数 zuhyo13 () を追加します。

function zuhyo13 () {
  let x = 0;
  console.log(x);
  for (let i = 0; i < 5; i++) {
    x = x + 10;
    console.log('x =', x);
  }
}
// --- 結果 ---
// 0
// x =  10
// x =  20
// x =  30
// x =  40
// x =  50

演習４

＜演習４＞

（1）図表 13 のコードを参考に「x の値を表示すると同時に繰り返している回数をその都度表示する」プロ グラムを作成しましょう。

（2）図表 13 のコードを参考に繰り返す回数だけを変更して「x の値が 100 になる」プログラムを作成しましょう。

（3）図表 13 のコードを参考に「x = x + 10」の部分だけを変更し，「1+2+3+4+5」の値を表示するプログラ ムを作成しましょう。

(1)を enshu4_1 ()、(2)を enshu4_2 ()、(3)を enshu4_3 ()とします。

function enshu4_1 () {
  let x = 0;
  console.log(x);
  for (let i = 0; i < 5; i++) {
    x = x + 10;
    console.log((i + 1) + '回目 x =' + x);
  }
}

function enshu4_2 () {
  let x = 0;
  console.log(x);
  for (let i = 0; i < 10; i++) {
    x = x + 10;
    console.log('x =', x);
  }
}

function enshu4_3 () {
  let x = 0;
  console.log(x);
  for (let i = 0; i < 5; i++) {
    x = x + (i + 1);
    console.log('x =', x);
  }
}

分岐と反復

分岐と反復を組み合わせた例

研修用教材JavaScript版 P24

図表13、図表15 の内容をコードに置き換えたのが図表16です。GASで記述しましょう。

新しい関数 zuhyo16 () を追加します。

function zuhyo16 () {
  let x = 0;
  for (let i = 1; i <= 6; i++) {
    x = x + 10;
    if (i % 2 === 1) {
      console.log("x =", x);
    }
  }
}
// --- 結果 ---
// x =  10
// x =  30
// x =  50

演習５

＜演習５＞

図表 16 のコードを参考に「 i が偶数の時だけ x の値を表示する」プログラムを作成しましょう。

function enshu5 () {
  let x = 0;
  for (let i = 1; i <= 6; i++) {
    x = x + 10;
    if (i % 2 === 0) {
      console.log("x =", x);
    }
  }
}

おわりに

GASを用いた順次・分岐・反復のプログラムについて紹介しました。

スクリプトの実行時に関数を選ばなければいけないなど、GAS特有のルールがあるので注意しましょう。

次回は、教員研修用教材の続きの「応用的プログラム（配列・乱数・関数・Web API）」について検討します。