JavaScriptの基本文法を学んでGoogle Apps Scriptを活用してみよう

はじめに

本記事は、プログラム初心者の方でもいきなりGoogle Apps Scriptでプログラムを開発できるようなコンテンツとなっております。「プログラムを始めてみたいけど何から始めていいかわからない」という方にはGoogle Apps Scriptを初めてみるのをお勧めします。言語はJavaScriptをベースにしており比較的容易ですし、Googleのすべてのサービスを初め、他サービスとの連携も容易に可能ですので、様々なシステム開発を可能にします。Google Apps Scriptで開発を行うにあたり、初学者の方は、まずプログラムの基本文法と次にGoogle Apps Script独自の関数を知っておく必要があります。Google Apps ScriptはJavaScriptをベースにした開発環境になります。ですので本記事は、最初にJavaScriptで必要最低限の文法を学び、次にGoogle Apps Scriptで簡単なプログラムを組んで動かしてみたいと思います。コードの解説も入れていますので、プログラムを理解しやすいかと思います。

第1章~プログラムの基本文法を学ぼう~

プログラム実行の流れ

まず初学者の方の場合、プログラムやスクリプトがどのような流れで処理が行われているのかわからないかもしれません。結論から言うと上から下へと一行ずつ処理が行われていると覚えましょう。関数処理などが入るとこの限りではないのですが、まずはこの基本的なことから覚えておくといいでしょう。

情報の保持に必要な変数という概念

JavaScriptだけでなくプログラムやスクリプトのほぼすべてに変数という概念があります。変数は袋や箱をイメージするとわかりやすいかもしれません。情報を入れておくためのものであり、それらをひとまとめに変数と呼んでいます。JavaScriptでは下記のように変数を保持することができます。

  • サンプルコード
    1. function myFunction() {
    2. var number = 10;
    3. var sentence = ‘文章を代入しています’;
    4. }

    基本的にJavaScriptではvarの後にスペースを入れて、そのあとに変数の名前を付けます。そして=で右側の値と繋ぐことで数字や文を代入することができるのが特徴です。最後に;を入力するのを忘れないようにしましょう。変数の名前とは袋や箱に名前を付けるようなものです。これらの情報をうまく使うことで独自の処理ができるようになります。

    条件分岐であるif文、if-else文を学ぶ

    プログラムやスクリプトにおいて条件分岐は重要です。例えば取得した情報を判別するのに活用することができるので、しっかりと構文を覚えましょう。

  • サンプルコード
    1. function myFunction(){
    2. var i = 2;
    3. if(i == 0)
    4. {
    5. Logger.log(‘iは0である’);
    6. }
    7. else if(i == 1)
    8. {
    9. Logger.log(‘iは1である’);
    10. }
    11. else
    12. {
    13. Logger.log(‘iは0と1以外である’);
    14. }
    15. }

    変数iには2が入っている状態でif-else文の処理を行っています。実行結果としてはログに「iは0と1以外である」という文字列が入ります。もしiが0であれば「iは0である」という文字列が入り、iが1の場合は「iは1である」とログに入ります。

    i == 0やi == 1のように==で書かれているのがあります。これは条件の比較を指しており、==の場合は一致しているかの判断になります。他にも比較する方法があり、等しくない場合は!=、左のほうが大きい場合は>、左が右と同数以上かは>=、右のほうが大きい場合は<、右が左と同数以上かは<=と表記します。

    これらの条件に合っていれば{}の中の処理が行われることになります。elseについてはifやelse ifで指定した条件以外を指します。今回のサンプルではif-else if-elseという表記でしたがif文のみやif-else if、if-elseの処理でも問題なく動作します。

    繰り返しの処理を行うにはfor文

    同じような処理を繰り返し行いたい場面も出てきます。その際に役に立つのがfor文です。基本的な書き方としては下記のようになります。

  • for(*初期値*; *条件式*; *変化式*)
  • こちらはサンプルを見るとわかりやすいと思いますので早速見てみましょう。

  • サンプルコード
    1. function myFunction() {
    2. var i;
    3. for(i = 0; i < 10; i++)
    4. {
    5. Logger.log(i);
    6. }
    7. }

    実行結果としては0から10までの数字がログに追加されます。繰り返し処理の解説としては変数iはfor文の処理に入ると0に初期化されます。次にiが10より小さいかをチェックします。条件が合っていれば{}の中へ入り処理を行います。

    {}の中の処理が終わったら再度条件式の確認をするのですが、ここで変化式であるi++の処理が行われます。これはiの値を+1する処理です。一回目の処理では0でしたが2回目の処理ではiは1となります。

    このように繰り返し処理をしていくとiが10になり、i < 10の条件式に合わなくなります。ここでfor文の処理が終了となります。

    今回はJavaScriptの中でも基本中の基本の構文を解説しました。ほかにも文法はありますが、まずは上述の基本をマスターするようにしましょう。

    第二章~Google Apps Scriptでプログラムを作ろう~

    では、ここからは基本文法のおさらいも兼ねて、実際にGoogle Apps Scriptを使って簡単なプログラムを開発をしていきたいと思います。その前にGoogle Apps Scriptについてどういったものかを紹介します。

    Google Apps Script(GAS)とは何か?

    冒頭でも触れましたが、Google Apps ScriptはGoogleが提供しているJavaScriptベースの開発環境です。Gmail、Googleカレンダー、スプレッドシート、ドキュメント、フォームなどGoogleのサービスをプログラミングを使って操作することができます。
    具体的には、以下のようなことができます。

    • スプレッドシートで普段手作業でしていることを自動化できる(マクロを作る)
    • Google Cloud SQL(DB)と連携させて、データの操作
    • Gmailに届いたメールを特定の条件で絞り込み、スプレッドシートに書き込こむ
    • ChatworkやSlackなどのSNSサービスと連携し、メッセージを送信する
    • スプレッドシートをDBにして、Webアプリケーションを作る
    • スクレイピング

    などGoogleで扱えるサービスなら基本的になんでもできると考えて良いでしょう。
    今回は、上述した基本文法を使い、スプレッドシートのデータを計算するマクロを作ってみましょう。

    前準備

    前準備として、Google Acountを取得しておいてください。
    無料で簡単に作成できます。

    スプレッドシートの作成

    Google Acountにログインしたら、Google Driveを開きます。
    左上の「新規」を押し、「Googleスプレッドシート」を選択します。
    スプレッドシートが開かれたら、左上の名前を任意に指定してください。
    今回は単純にテーブルに登録されているメンバーの所持金を男女別に足して結果を出力するのみとなりますので、スプレッドシートの名前は「所持金表」としました。

    テーブルを作成

    スプレッドシートに以下のようなテーブルを作成してください。
    ※最初のセルA1セルから初めてください。

    性別名前所持金男性合計女性合計
    太郎1000
    光子350
    恵子700
    次郎1200
    50
    ジョナサン5000
    エリザベス3800
    竜彦450
    真理600
    綾子500

    コード.gsの作成

    スプレッドシート「所持金表」の上のタブから「ツール」を選択し、「スクリプトエディタ」を選択します。すると「コード.gs」というスクリプトが表示されます。このスクリプトに関数(Googleに行わせたい処理)を書いていきます。一行づつ説明していきますので、以下のように記述してください。

    1. function SumMoney(){
    2. var sheet = SpreadsheetApp.getActiveSheet();
    3. var MenTotal = 0;
    4. var WomenTotal = 0;
    5. var lastRow = sheet.getLastRow();
    6. for (var i=2; i<=lastRow; i++) {
    7. if (sheet.getRange(i, 1).getValue()==”男”){
    8. MenTotal = sheet.getRange(i, 3).getValue()+MenTotal;
    9. }
    10. else if (sheet.getRange(i, 1).getValue()==”女”){
    11. WomenTotal = sheet.getRange(i, 3).getValue()+WomenTotal;
    12. }
    13. }
    14. sheet.getRange(2,4).setValue(MenTotal);
    15. sheet.getRange(2,5).setValue(WomenTotal);
    16. }

    コード.gsの解説

    1.関数を記載する際には、文頭に「function」を書きます。「これは関数ですよ」と宣言しています。そしてその後に関数名を書きます。ここは任意で、私は「SumMoney」としました。「お金を計算する」という意味です。関数名はその関数を端的に表す英単語を使うのが良いでしょう。

    2.~5.は変数を宣言しています。

    2.ですが、Google Apps Script専用のクラスとメソッドを使ってオブジェクトを作成しています。クラスとメソッドについては詳しい説明は割愛しますが、Google Apps Scriptでスプレッドシートを操作する場合は、2.のように変数を作って、対象のシートを定義します。このSheet情報の入った変数を呼び出すことでセルの操作が可能になります。非常によく使う書き方なので、そのまま覚えておくと良いでしょう。

    3.は、男性の所持金の合計を入れる変数です。

    4.は、女性の所持金の合計を入れる変数です。

    5.は、データの入っているセルの最終行を取得し、変数に代入しています。2.で定義したSheetオブジェクトからgetLastRow()メソッドを呼び出し対象シートの最終行を取得しています。

    6.~13.では上述したFor文(繰り返し)を利用します。繰り返しの条件は、初期値iが2、iがデータの入っているセルの最終行以下の間繰り返す、繰り返す毎にiに1を加算する、となります。何がしたいかと言うと、変数iは行の番号を指定しています。スプレッドシートのテーブルを見て頂くと、最初の行は項目名となっていますので除外し、2行目からを指定します。

    7.~11.はif文(条件分岐)ですね。sheet.getRange(i, 1)は、i行目の1列目のセルを指定しています。さらに.getValue()メソッドを使うことでそのセルの値を取得しています。値が男の場合は、同行の3列目の「所持金」の値を抽出し、MenTotalに入れていきます。8. で「+MenTotal」と書いてMenTotalの値をMenTotalに加算させていますが、こうすることで、繰り返す毎に取得した所持金が蓄積されていきます。変数を使って加算させる基本的なテクニックですので、知らない方は是非覚えておくと良いでしょう。10.~11.ではi行目の1列目が女の場合の分岐となります。男同様に女の所持金をWomenTotal変数を使って加算させていきます。最終行までこれを繰り返します。

    14.、15.では最終的に加算されたMenTotalとWomenTotalの値を、二行目の4列目と5列目にそれぞれ代入させています。

    以上が関数「SumMoney」の説明になります。書き終わったら「保存」するのを忘れないようにしましょう。

    実行ボタンを作ろう

    コード.gsからスプレッドシート「所持金表」に戻りましょう。
    「挿入」を押下します。
    「図形描画」を押下し、上部のタブから「図形」を選択します。任意で構いませんので、ボタンとして適切な図形を選びます。
    スプレッドシート上に置かれた図形をクリックすると左上にメニューが出ますので、メニューから「スクリプトを割り当て」を選びます。
    表示されたテキストボックスにコード.jsで定義した関数名「SumMoney」を入れます。
    これですべて完了しました。大変お疲れ様でした。後はボタンを押すだけです。

    実行してみる

    それでは、実行ボタンを押してみましょう。
    実行ボタンを押すと、認証画面が一度現れます。これはGoogleではなく自分で作成したアプリなので、警告が出ているというわけです。アプリ自体を公開しているわけではないので、すべて認証してしまって問題ありません。
    正常に実行されると2Dセルと2Eセルに合計値が出力されます。
    そしたら成功になります。

    最後に

    いかがでしたでしょうか?
    プログラムの基礎的なことと、Google Apps Scriptの基本的な使い方について理解を深めて頂けたら幸いです。今回作成したプログラムですが、「所持金表」の最終行の後に性別、名前、所持金を入れた1行を足してみてください。そして再度実行してみると集計結果が変わっていることに気づきます。繰り返しの条件を「最終行まで読み取る」としていますので、追記がある度にデータのあるすべての行を集計し直してくれます。手作業でやる場合には、なかなかこういうわけにはいきません。特にGoogleスプレッドシートは複数人で共有して編集することが可能ですので、大量の追記があった場合でも、こうしたマクロを組んでおけば、毎回毎回集計し直す必要もありません。そして、最後に強調しておきますが、Google Apps Scriptは本当に様々な可能性を秘めています。今回は単純にスプレッドシートを自動で集計するプログラムでしたが、このプログラムを改造して、出力結果を自動でWebページに表示させることやChatWorkなどのSNSなどに送信することも簡単にできます。是非色々試してみてください。以上です。ありがとうございました。