複雑なコードの書き方

これはあなたが書いたコードについて考えることについての投稿です。 ここに含まれるすべてが私の意見であり、あなたは常により良いものにそれらを比較することにより、私の意見の妥当性を考慮す 私が使用する言語はJavascriptです。 この記事を理解するための前提条件は、中間Javascriptを知っていることと、いくつかのオブジェクト指向の概念に精通していることです。 この記事は、Cristina Lopesの優れた本「Exercises in Programming Style」の第9章に触発されています。

コード内の本当に一般的なパターンは次のとおりです—

  1. 単純なオブジェクトの定義
var store_item = {
name : 'wonderball'
}

2. 次に、webページに表示する準備をするために、いくつかの関数を使用して各プロパティを実行します。

addExclamationPoint(store_item);
capitalizeName(store_item);function addExclamationPoint(item) {
item.name = item.name + '!';
}function capitalizeName(item) {
// some code to capitalize item.name, cut out for brevity.
}

そして、これは私たちが頻繁にデータを表示する準備ができて取得する方法です。 今、私たちのstore_itemは大文字の名前と感嘆符を持っているので、私たちは問題なく私たちのwebページにそれを表示することができます。 3番目に必要なことがある場合は、データを変換するための3番目の関数を記述し、通常のようにアイテムを渡します。

ここで作成したより大きく大きな画像パターンは次のとおりです:

このタイプのプログラミングには、”手続き型”や”命令型”などの派手な用語がいくつかありますが、私はそれを別の用語と呼びます:”単純”。 それは非常に簡単なプログラミングです。 それは誰もが最初に学ぶプログラミングのタイプです。 小規模のプログラムでは、人間は1から10の論理的なステップを非常にうまく実行するのが得意なので、プログラムするのは絶対に最良の方法です。

プログラムが十分に大きくなったとき(データが表示される前に10以上の変換)、または関数が多くのデータオブジェクトを変更しているとき(2以上)、または分岐ロジックを引き起こすIF文がたくさんあるとき、この”単純な”プログラミングは代わりに”混乱”になります。

ほとんどのすべてのプロジェクトやコードは乱雑になります。 プログラミングのほとんどは、実際には、データを表示する実際の問題の解決策ではなく、混乱を避ける方法を考え出すコーダーです。 プログラミングの仕事は、100個のデータに100個の変換を適用し、それを”混乱しない”ようにするような方法でコードを書くことを学ぶことです。

さて、上記のパターンの大きな変更を紹介しましょう。 これは、webページのデータを変更するような簡単なことを行う方法についての新しい考え方を紹介します。 オブジェクトには’bind’と呼ばれる独自の関数があり、その関数はデータの変換を担当します。

var store_item = {
name: 'wonderball',
bind: function(func) {
this.name = func(this.name);
return this;
}
}// Here are two functions I'll use to transform the store_item.name, each one now just takes a name and modifies it, neither function has any clue what properties it's changing in store_item anymore.function capitalize(name) {
return name.replace(/\w\S*/g, function(txt) {
return txt.charAt(0).toUpperCase() +
txt.substr(1).toLowerCase();
});
}function addExclamationPoint(name) {
return name + '!';
}store_item.bind(addExclamationPoint).bind(capitalize);

このソリューションは、上記の元の”単純な”コードとまったく同じように動作しますが、より複雑に見えるのはなぜですか? 私たちが持っている単純なタスクのために、それはやり過ぎですが、この複雑さのトレードオフは何ですか?

それに答えるために、何が違うのか話しましょう:

  1. 名前の新しい値ではなく、別の関数を引数として取る、この狂った奇妙な’bind’関数がありますが、今は何を言いますか?
  2. capitalize関数とaddExclamationPoint関数は異なりますが、現在は呼び出されませんitem.name 直接もう。
  3. 私たちはもはや’=’で名前を設定しません、代わりにこの奇妙なstore_itemを使用します。bind(function_name),構文の代わりに.

これらの3つの違いで、私たちは今、自分自身に尋ねなければなりません、この変更は良いですか? プロジェクトがこの小さなままであればそうではないかもしれません。 プロジェクトがはるかに大きくなった場合は多分はい。

重要な変更は、store_itemオブジェクトがbind関数を介してその状態を処理する責任があることです。 もちろん含まれておりませんが、直接変更store_item.名称のオブジェクトは実質的に絶叫:”こんにちは、私が結合する機能を変更!”.

しかし、今では、複数のstore_itemsがそれぞれ独自の状態を管理するパターンを見るのは簡単です。バインド関数:

// Three store items, each one with a different state.store_item1.bind(addExclamationPoint).bind(capitalize); //Wonderball!store_item2.bind(capitalize);
//Wonderballstore_item3.bind(addExclamationPoint);
//wonderball!

私たちは100store_itemを作り、その状態をかなり簡単に管理することができます。 私たちがしなければならないのは、戻り値だけを持ち、オブジェクトを使用する関数を書くことだけです。バインド関数。

このパターンの魔法はbind関数にありますので、もう少し調べてみましょう。

// 1. First define the function, and have it take as an argument another function. Taking a function as an argument, instead of data is the core change here. bind: function(func) { // 2. This second line is the secret sauce, it will run the function you passed in with 'this.name' as an argument, and then assign whatever value is returned to this.name. Mull this over. this.name = func(this.name);// 3. Finally, return 'this'. You don't have to have this step in here, but returning 'this' is what allows .bind chainging to happen (.e.g. doing .bind().bind() vs .bind(); .bind();) return this;
}

だから、あなたはそれを持っている、私たちは私たちのコードをより複雑にしましたが、今、私たちはいくつかの新しい利点を持っています:

  1. オブジェクトは独自の状態を変更するようになり、1行で大幅に変更できます。
  2. 私たちが書いた関数はより純粋で、上の例のようにオブジェクトのプロパティを変更せず、入力を取得して出力を返すだけです。
  3. オブジェクトの状態を変更するとき、使用する関数はおそらく他のオブジェクトの状態を誤って変更しないことを知っています

しかし、:

  1. あなたのコードは、今の新人にとっては間違いなく直感的ではありません。
  2. 小さなサイトでは、このコードは非常に複雑です。

だから、最終判断は何ですか、この方法は良いですか? もっと悪い? もっと混乱? (最初は、はい。 このようなパターンを考慮して理解することは、Javascriptを学び、コーダーとして成長することの一部です。 問題を解決するためにコーディングの”単純な”方法を継続的に使用することは、しばらくすると持続不可能になります。 あなたが物事を行うより多くの”複雑な”方法を学ぶために時間を取る場合は、多くの素晴らしいことが起こります:横方向に考える能力が開き、より多 多分それはこれおよび他のパターンを学ぶことへ実質の利点である。

コメントを残す

メールアドレスが公開されることはありません。