JavaScriptっぽいコード

あれ、なんか読みづらい…
findTousenに関数オブジェクトrenderを渡して、コールバック関数的な感じで使ってもらっているところに気持ちよさを感じたい。更にidはrenderクロージャーの中に閉じ込めている点にも気持ちよさを感じる。

var isOpen = [];

function open(id) {

    if(isOpen[id]) {
        $('#table'+id).remove();
        $('#link'+id).html('Open');
        isOpen[id] = false;
        return;

    } else {
        $('#link'+id).html('Close');
        isOpen[id] = true;
    }
    // この部分がJavaScriptっぽい！
    // くろおじゃあ使って関数オブジェクトを作っている所が…
    // くろおじゃあの考え方これでいいのかな？
    var render = function(id) {
        return function(data) {
            var html = "<table id=table"+id+">";
            html += "<tr>";
            html += "<th>name</th>";
            html += "<th>mail</th>";
            html += "</tr>";

            // なしの場合
            if(data[0] === undefined){
                html += "<tr>";
                html += "<td>いません</td>";
                html += "<td>データないです</td>";
                html += "</tr>";

            // ありの場合
            } else {
                for (var i in data) {
                    html += "<tr>";
                    html += "<td>" + data[i].name + "</td>";
                    html += "<td>" + data[i].mail + "</td>";
                    html += "</tr>";
                }
            }
            html += "</table>";
            $('#item'+id).append(html);
        }
    }(id);

    findTousen(id, render);

}
function findTousen(id, render) {
    $.ajax({
        cache: false,
        type: "GET",
        url: "findhoge/"+id,
        timeout: 7000,
        dataType:"json",
        beforeSend: function() {
            // alert("通信するよー");
        },
        complete: function() {
            // alert("通信おわたー");
        },
        success: function(data){
            render(data);
        },
        error: function(){
            alert("サーバーとかネットワークとか確認してください");
        }
    });

}

renderでクロージャーな関数オブジェクトを渡して、xhr通信終ったら呼んでもらってる。
こんな書き方じゃなくてもよさそうだけど、くろおじゃあつかいてぇぇぇぇえ！と思って書いた。
なんか「お前だけが知っていればいいんだ」的な情報は外に見せる必要ないし、変数を分散させてわかりづらくしたくないからまとめたい。スコープを小さく、小さく…んーわからん。なんでもない。