なぜクロージャで定義された同じ変数にアクセスするよりも、（refとして）変数を渡すのが遅いのですか？

Question

は考える：

(function() { 
    var items = [1, 2, 3, 4]; 

    // In Chrome, this takes ~8-10 ms to execute. 
    for(var i = 0; i < items.length; i++) { 
     x(items); 
    } 

    // In Chrome, this takes 1-2 ms to execute. 
    for(var i = 0; i < items.length; i++) { 
     y(); 
    } 

    function x(y) { 
     y[0] = -100; 
    } 

    function y() { 
     items[0] = 100; 
    } 
})(); 

なぜXへの呼び出し（）Y（への呼び出しよりも遅く8-10倍）がありますか？ y（）の実行時に可変解像度が必要ないためですか？

Answer 1

私は最初の反復を除いて時間の違いを見ません.2は起動時に追加されるものを除いて大きな違いはないことを示唆しています。 V8 doesn't optimize immediately AFAIKだから、バランスをとるのに何度か反復が必要な理由を説明することができます。また、キャッシュミス。あなたがこれを決定するためのコードをプロファイリングしているどのように

function log() { 
 
    var div = document.createElement("div"); 
 
    div.textContent = Array.prototype.join.call(arguments, " "); 
 
    document.body.appendChild(div); 
 
}; 
 

 
(function() { 
 
    var items = new Array(10000000); 
 

 
    for (j = 0; j < 20; ++j) { 
 
     var xStart = performance.now(); 
 
     for(var i = 0; i < items.length; i++) { 
 
      x(items); 
 
     } 
 
     var xDuration = performance.now() - xStart; 
 

 
     var yStart = performance.now(); 
 
     for(var i = 0; i < items.length; i++) { 
 
      y(); 
 
     } 
 
     var yDuration = performance.now() - yStart; 
 
     log(j, "x:", xDuration.toFixed(3) + "ms", 
 
      "y:", yDuration.toFixed(3) + "ms", 
 
      "diff:", (xDuration - yDuration).toFixed(3) + "ms"); 
 
    } 
 
    
 
    function x(y) { 
 
     y[0] = -100; 
 
    } 
 

 
    function y() { 
 
     items[0] = 100; 
 
    } 
 
})();

body { font-family: monospace; }