2

コンピュータリソースの観点から、より効率的なものは何でしょうか。次のように、イベントハンドラーをループ内に配置します。

$('ul li').each(function()
{
    $(this).mouseover(function()
    {
        // code to do something 
    });

または、ループの外側に関数を設定し、次のようにループ内で関数の呼び出しを作成します。

$('ul li').each(function()
{
    $(this).mouseover(function()
    {
        doStuff($(this)); 
    });

function doStuff(liElem)
{
    // code to do something 
}

ループが繰り返されるたびに何かを実行するコードが繰り返されないため、2番目のオプションはコンピューター上でより簡単であるように思われます。イベントハンドラーのコードは、ループを通過するたびにコンピューターのメモリに作成されますか、それとも1回だけ作成されますか?何かご意見は?

4

1 に答える 1

1

さまざまな最適化が可能ですが、それをあなたが求めたアプローチに固有に保つために、以下のコードのインラインコメントとして答えを見つけてください

最初のアプローチ:

$('ul li').each(function()
{
    // Maybe you might like to declare some variables here
    $(this).mouseover(function()
    {
        // code to do something

        // Maybe you might like to use the variables declared in above function

        // Disadvantage over other approach
        // The code written here will need to store the context information of the outer function and global context

        // Advantage over other approach
        // You can directly access the variables declared in the above function
    });
}

または、ループの外側に関数を設定し、次のようにループ内で関数の呼び出しを作成します。

2番目のアプローチ:

$('ul li').each(function()
{
    // Maybe you might like to declare some variables here
    $(this).mouseover(function()
    {
        doStuff($(this)); 
    });
});

function doStuff(liElem)
{
    // code to do something

    // Advantage over other approach
    // The code written here will need to store the context information only for the global context

    // Disadvantage over other approach
    // You cannot directly access the variables declared in the outer function as you can in the other approach,
    // you will need to pass them to the doStuff function to access here
}
于 2012-12-30T22:40:29.660 に答える