2

私は JavaScript でより大きなものを構築し始めており、コーディング スタイルとパフォーマンスについて疑問に思っています。この場合、イベント ハンドラーをアタッチする最善の方法を見つけようとしています。ドキュメント内に div があり、対応する ID を持つ Item() 構築オブジェクトがあります。各 div のイベント ハンドラーからアイテム オブジェクト表現にアクセスしたいと考えています。アイテムは頻繁に操作、作成、削除などされ、div も同様です。ここでコードを見ることができます(一般的なコーディング スタイルに関するフィードバックをお寄せください)。

私はこれを行うことができます:

  1. すべてのイベント ハンドラーを Item コンストラクターに直接配置して、構築中のオブジェクトにアクセスできるようにします (var that = this)。このすべてのコードをここに置くのはあまり良い考えではないと思いますが、考えすぎかもしれません。

  2. ハンドラーを別の handlerCollection オブジェクトに格納し、補助関数 getItemFromDOM(div) を使用してアイテム オブジェクトにアクセスします。この関数は、div ID を読み取り、ドキュメント内のすべてのアイテムが格納されている配列内の対応するアイテムを検索します。

  3. コード内のどこかに別の関数 registerItemEvents(item) が Item コンストラクターで呼び出され、その内部に存在するハンドラーのアイテムに対するクロージャーを生成するために使用されます。

最もエレガントなのは 3 番目のものだと思いますが、1 番目のものを断って整理整頓を過大評価している可能性があります。また、3番目を使用して、アイテムの削除を開始すると、それらのクロージャーがメモリの解放を妨げ、最終的に全体が遅くなる可能性はありますか? アイテムを削除する前にイベント ハンドラーを解放するだけで、これを修正できますか?

4

1 に答える 1

0

可能であれば、デリゲートの使用を検討する必要があると思います。私の知る限り、イベント ハンドラーを追加および削除すると、不要なオーバーヘッドが追加されます。

どのように実装するか (jquery、yui、その他、カスタム) に関係なく、Yahoo! からのこの投稿を参考にしてください。良い情報があります

http://www.yuiblog.com/blog/2009/11/13/event-delegation-3/

于 2012-08-10T08:18:13.163 に答える