現在JavaScriptの設定が無効になっています。このページを利用するにはJavaScriptの設定を有効にしてください。「第二回」では、グレー文字入り入力欄という課題への解答例としました。プログラムの設計といったものがどんなものなのか、その面白さが少しでも伝わっていれば幸いです。いえ、動いてさえいればあとはどれも似たようなもので、あとはプログラマの自己満足の世界です。その中での創意工夫はプログラマに閉じた世界とはいえ、ポケットの中に広がった空ではないかと思っています。前回の最後の問題の答えを示す前に一つ重要なことを忘れていました。使ってもらう為にはライブラリ化が必要でした。*三回目となるこの記事からは、皆さんお待ちかねの関数化・ライブラリ化といったプログラムを隠す手法を試していこうと思います。ロジックの複雑化や高機能化につれてこうした手法はさまざまな手法が開発され技術の進歩は目覚しいなと感じさせる分野です。今回は例として示すプログラムの量が多くなっていますが、どれも同じことを形を変えて実現しています。細部にはこだわらずぱっと見の印象でプログラムをつかんでいただければとさて、今回の内容に関しては達人といっていい先輩諸氏がいらっしゃるのでそうした先達の知恵を拝借していきましょう。外部ファイル化すべき・ライブラリ化すべきといったところです。ふーん、そんなものかと思って眺めていただければ結構です。今回は実際にこれらを試してみましょう。</form>これは最初に提示したごく簡単な例です。この例はよくない状態であるということになりますので、これを分離していきます。);}}addGrayDesc("input");//--></script>ライブラリ化の手順として最初にまず「分離」を行います。混在していた部分を視覚的にもわかるレベルで細かい部品に分けて一つにまとめます。出来上がったコードはずいぶんと巨大化してしまいました。簡単な例ではなんとか目で追えば理解できそうだったプログラム部分も、もはやこの時点では動くことを祈るのみになっています。利用をやめた為にブラウザ分岐が必要になってしまった為です。ここで終わりではなく、分離の次は隠す作業が待っています。部分がごっそり分離されました。ここまでで一つの完成系としておきます。これが正しい姿である、と言われてしまえばそんなものかとも思えますし、プログラムも簡単な例と比べても違和感はありません。この程度では納得できない方は、さらに見た目の短さを追及することも可能です。部分も含めてプログラム内に格納してみます。ようなものが部分的に格納されているのがわかります。することでさらにこの全体を分離・隠すことが可能になります。</form>そしてこれが全力でコードを隠した結果です。シンプルになりました。同じ事を同じように実現し、同じように動作する5つのコードができました。した作業にどれだけ価値を見いだせるか。プログラマであればこうした、すでに動作しているコードを別の形で表現しなおすといったことは、誰でも一度は経験したことのある作業ではないでしょうか。*ここまで、ABCDEと作ってきました。ここから先はかなり好みの入る世界になってきます。JAPANでは情報技術を駆使して人々や社会の課題を一緒に解決していける方を募集しています。詳しくは採用情報をご覧ください。JAPANのサービス開発を支える技術やデザイン、文化を発信しています。Reserved.このページの先頭へ。