21階層ネストの再帰的ソリューション


さっき1篇の文章《21 nested callbacks》を見て、作者はその時彼がプログラミングを学んだ時の1つの面白い事にツッコミを入れました:HTMLのアニメーションを書くために、彼は21階層ネスト関数を書きました.作者は主に叙情的なので、このような英語は読みにくい.私は彼の最も重要な思想を抽出した.
1、最初の実現、素朴な実現
実はこのお兄さんは20個のdivを順番にユーザーの目の前に見せたいと思っています.彼はJQueryライブラリのanimate関数を使って、この関数はコールバックを受け入れて、アニメーションが完成する時このコールバック関数は実行されます.兄の最初の考えは素朴でした.それは、最初のdivが表示されたとき、コールバック関数を入力して2番目のdivを表示することです.コードは次のように似ています.
$(".disappear").click(function(){

  $("#div1").animate({ "opacity": "100" },

    100,

    function(){$("#div2").animate({ "opacity": "100" },

      100,

      function(){$("#div3").animate({ "opacity": "100" },

        100,

----------omit for brevity----------

          function(){$("#div20").animate({ "opacity": "100" },

            100)           

})})})})})})})})})})})})})})})})})})})})})})})})

率直に言って、この考えもまあまあです.少なくとも機能を正しく実現できるのは、コードがみっともないので、21個のコールバック関数をきちんとしなければなりません.通常、これも最も人間の直感に合っており、現実の人々はこのように問題を解決している.これはファン・ケイが『RubyコミュニティはRails化すべきだ』でNodeJSのプログラミングスタイルが反人類の主な原因だと述べたのかもしれない.
node.jsのEvent IOプログラミングスタイルは私から見れば「反人間」で、極めて変態だ.コードを書くための規模のアプリケーションでは、コードの可読性とメンテナンス性が悪い.Event IOは最下位の技術で、なぜcoroutineにカプセル化して使用しないのか理解しにくい.node.jsはreal-timeタイプのアプリケーションを開発するのにのみ適しています.
このような方法で実現すれば、確かに反人類であり、この兄が自分を「狂有忍耐」と自嘲したように.
2,関数式の実装,再帰的実装
コードから見ると、最初の直感は似たようなコードが多すぎるかもしれません.もっときれいなコードを望むなら、繰り返しを減らさなければなりません.つまり、私たちがよく言っているDRYです.コードの外観から見ると、この関数には明らかに「展開」があり、コードの実行から見ると「収縮」のプロセスがある.これが再帰ではないか.
function hideOrShowPrev($elem, opacity){

    $elem.animate({ "opacity": opacity },

        100,

        function(){

            var $toHide = $elem.prev();

            if($toHide){

                hideOrShowPrev($toHide, opacity);

            }            

    })

}



$("#start").click(function(){

   hideOrShowPrev( $('#row20'), 100);

});

この実現は私のCopyコメントの友达の一人です.