js［001］HTAのすすめ

実務においては、業務マニュアルはいまだに紙ベースで配布される現場が多い。

紙のマニュアルは余白などに自分なりの補足メモを書き残しておいたりもできるので、それがその人の業務バイブルのようになってしまい、なかなか紙のマニュアルから脱却することができないのだ。
だが、今どきのオフィス業務はパソコンで様々な情報にいち早くアクセスし、更新された情報は直ちにスタッフ全員に共有されることが求められる。このスピード感に乗り遅れてしまっては業務の効率化など夢のまた夢である。


動的な情報活用
業務の効率化は［時間］［モノ］［労力］などの資源の消費を抑えることでしか実現できないのに、紙のマニュアルは紙という［モノ］を消費し、情報へアクセスするためにはページをめくって探すという［時間］と［労力］を消費してしまうのだ。
10ページや20ページほどのマニュアルならまだしも、100ページを超える紙のマニュアルとなると情報の効率的な活用は難しいと言わざるを得ない。
また、印刷を前提としたマニュアルの作成には Word や PowerPoint が使われることが多いが、それらのファイルはどうしても「静的」なものになりがちで、「動的」に情報へアクセスすることが難しい。

その点、Excel で作成されたファイルは数式などを使って情報を動的に扱うことが簡単にできる。
が、その反面、データの操作を間違うと情報の正確性が担保されないという欠点もある。さらには、例の "悪魔の" 「エクセル方眼紙」が情報の再利用を阻んでしまう。


エクセル方眼紙の憂鬱
エクセル方眼紙の背景には明らかに「紙」の思想がある。
紙ベースの情報というのはデータと見た目が同じレイヤー（層）に存在しており、切り離して扱うことが難しい。エクセル方眼紙もそれと全く変わらない。紙の見たままを Excel で書いているにすぎないのだ。つまり、エクセル方眼紙とは Excel ではなく「紙」なのである。

もちろん、モノとしての紙がもつ大きな利点はある。それは保存性能が極めて良いとうことだ。
たとえば、DVDの寿命は数十年と言われているので、百年後に問題なくデータを取り出せるという保証はない。だが、紙に書かれたものは焼けさえしなければ、おそらく数百年後でも閲覧が可能だろう。現に数百年前に書かれたものが今でも現存している。
なので、紙というのは情報を活用するものではなく保存するものなのだ。


ActiveXオブジェクトの効用
いいかげん、我々はデータと見た目を別物として扱うことに慣れなければならない。それらを同じレイヤーで扱っていてはだめなのである。これは何もエンジニアだけの特権ではない。一般のサラリーマンやOLの水準でこれができないとオフィスのIT化や業務効率化は一向に進まないのだ。

そこで、情報を動的に扱うことができ、データの正確性もそれなりに担保され、かつ特別なアプリケーションをインストールする必要もなく使うことのできるツールとして HTA をおすすめする。
HTA のファイルは、HTMLで書いたコードを拡張子 .hta で保存するだけで作成できる。ただし、IEのエンジンを使うので Windows 限定である。
HTML は、データがどういうものであるかをタグによって定義し、それをどのように見せるかは CSS によって定義する。つまり、データの構造と見た目は別物として扱うので、そういう感覚を養うのにはうってつけである。

HTML と HTA の違いは、

  • ツールバーなどがないのでウィンドウがすっきりする
  • ActiveXオブジェクトを操作することができる

ぐらいだが、この ActiveX を扱えるというのが実に大きいのだ。
HTML では ActiveX を使おうとするとブラウザによっては拒否されるか実行許可を求められるが、HTA だと ActiveX によって（ファイルやフォルダなどの）ローカルリソースへのアクセスやシェルスクリプト（Windowsコマンド）の操作が可能になる。もちろん、（アクセス権があれば）ファイル共有サーバ上のリソースへのアクセスも可能だ。


実践HTA
一例として、デスクトップ上に特定のツリー構造をもつフォルダを作成するツールを作ってみよう。
下に書いたコードを拡張子 .hta かつ文字コードUTF-8で保存したファイルをダブルクリックして起動すると、

f:id:istoyo:20201103201355p:plain

というウィンドウが現れる。
このテキストボックスに例えば 202011 と入力して［フォルダ作成］ボタンをクリックすると、デスクトップに

202011
├─議事録_202011
│ ├─田中_202011
│ ├─佐藤_202011
│ ├─鈴木_202011
│ ├─高橋_202011
│ └─山本_202011
├─PDF_202011
└─WORD_202011

というツリー構造のフォルダが作成される。
毎月決められたツリー構造のフォルダを作らなければならない場合などに便利だし、こういった作業はフォルダが多くなるほどそれを手作業でやるのは面倒だ。

他にも JavaScript のさまざまな機能を利用して HTA でマニュアルを作れば、ボタンやリンクを随所にちりばめて極めて動的なマニュアルを作成することができる。
HTA 以外にも Windows に標準で備わっている機能だけで実にさまざまな業務を自動化および半自動化することができるが、学習コストのリターンが最強のプログラミング言語はおそらく JavaScript かもしれない。

やれ Pyhton だの、IEはオワコンだのと騒ぐ前に、いま目の前にあるパソコンが標準で備えている機能を最大限活用し、実利をとることを考えたほうが良い。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <script>
        var wshll = new ActiveXObject("WScript.Shell");
        var desktop = wshll.SpecialFolders("Desktop");

        function MakeFolder(){
            var yyyymm = document.getElementById("datebox").value;
            var folderPath = desktop + "\\" + yyyymm;
            var docFolder = folderPath + "\\議事録_" + yyyymm;
            wshll.run("cmd /c md " + docFolder, 0);

            var writers = ["田中_","佐藤_","鈴木_","高橋_","山本_"];
            for(var i=0; i < writers.length; i++){
                wshll.run("cmd /c md " + docFolder + "\\" + writers[i] + yyyymm, 0);
            }

            wshll.run("cmd /c md " + folderPath + "\\PDF_" + yyyymm, 0);
            wshll.run("cmd /c md " + folderPath + "\\WORD_" + yyyymm, 0);
            wshll.run("explorer.exe /e, " + folderPath);
        }
    </script>
    <title>HTAのすすめ</title>
</head>
<body>
    <p>
        <input type="text" id="datebox" size="10"/>
        <input type="button" value="フォルダを作成" onclick="MakeFolder();"/>
    </p>
</body>
</html>

ここでは、上記コードの具体的な解説は割愛するが、とくに難しいところはないと思われる。
例によって、スクリプトコード部分の大半は変数への値の代入だし、初学者が躓くとしたら担当者名の配列を for文で回すところぐらいだろうが、これも配列や for文の講義の最初に出てくるような基本的な使い方なので理解するのにそれほど時間はかからないだろう。


初学者の壁
そもそも、プログラミングコードというのは9割以上が以下の4つで占められる。

  1. 変数への値の代入
  2. 関数の呼び出し
  3. メソッドの呼び出し
  4. プロパティの呼び出し

あとは、せいぜい if文や for文で分岐や繰り返しを指示するくらいである。

メソッドやプロパティの呼び出しはオブジェクトに対して行われるが、初学者が理解できていないのは、そのオブジェクトがどういうオブジェクトでどのようなメソッドとプロパティを持つのか、呼びだされた関数が何をする関数でどのような引数と戻り値を持つのかということである。
だが、これはもう自分で調べるしかない。よく使われる基本的な関数やオブジェクトは覚えておいたほうが良いが、何もすべてを覚える必要はなく、わからなかった時点で調べればよいのである。

むしろ初学者にとって、ゴルフで言うところの「100切り」のようなひとつの壁は、プログラミングの場合はおそらく「配列」だと思う。
たいていのプログラミングの教科書では、配列とは複数のデータをひとつの箱の中に順番に並べたもので・・・といった解説がされているが、配列が「どのようなものか」ということではなく、「なぜそんなものがあるのか」ということを理解すべきなのだ。


配列の背景
配列というものが考え出されたのは、たくさんのデータをひとつだけの変数で処理したいからだ。

配列は、コンピュータが処理しやすいように中の要素は数値ならすべて数値、文字ならすべて文字と、型が統一されいてる。
が、そうなると当然のごとく数値も文字も一緒くたにして扱いたいという要望が生まれるのが自然だ。さらには、数値や文字のみならず、配列そのものや関数すらも要素のひとつとして扱えるよう、連想配列やコレクションあるいは構造体やオブジェクトといったものに発展していったが、中身によって呼び名が違うだけのことである。つまり、極論すればオブジェクトとは配列のおばけみたいなものだ。

とくにオブジェクトについては中のデータに簡単にはアクセスできないようにカプセル化し堅牢性を高めた。なぜそういうことをするのかと言うと、複数人での大規模な開発にも耐えられるようデータの安全性を保証する必要があったからだ。
なので、オブジェクトというものを難しく考えてはいけない。要は関数やデータなどの種類の違う複数の要素をひとつにまとめてひとつの変数だけで処理したい、というだけのことであって、配列の思想と何ら変わらないのである。中の要素へのアクセスの仕方が通常の配列とは異なるというだけの話なのだ。

プログラミングは、そのコードが何をやっているのかということよりも、なぜそうするのかということを理解しながら読むのが上達の近道なのである。