再利用可能なコードを書く時のフロー

プログラムを書く上で再利用可能なコードを書くことは非常に重要です。

再利用可能なコードを書くときの、私の頭の中のフローをご紹介します。

ハードコードする

ハードコードしてもプログラムとしては動きます。

とりあえず動かしたい時は、まずはハードコードします。

しかし、これは再利用できないコードです。

慣れてくれば、いきなり次のステップからやります。

動的に変更した部分をパラメータとして渡す

次に考えるのは、動的に変更した部分を関数の引数として渡すことです。

例えば、足算するために二つの値を渡す、や、HTMLに要素を追加するために、追加される親要素・追加する要素・表示するテキストを渡す、などです。

これでも十分再利用可能ですが、さらに次のステップに進みます。

パラメータに処理を渡す・処理をつなげる

JavaScriptなどでは、関数の引数に関数を渡すことが可能です。

つまり、動的に変更したい部分を、処理に置き換えることも可能です。

そして、それをパイプラインのようにつなげることができれば、処理を理解することが楽になります。

先ほどの例でいうと、以下のようなイメージです。

  • 文字列を受け取って、それを返す処理を実行する (“Hello")
  • 文字列を受け取って、要素を返す処理を実行する (<div>Hello</di>)
  • 要素を受け取って、要素を追加する処理を実行する

このように、関数を実行した結果を次の関数に渡し、次の関数の結果をさらに次の関数に渡す、というようなバケツリレーのようなコードを書くと、さらに柔軟性が高まります。

例えば、実はHTMLに要素を追加するのではなく、ファイルに出したい・console.logに出したい、となったときには、一番最後の処理だけを他のにもすれば良く、他のコードには一切影響を与えません。