javascript - 我应该为内存性能静态分配 Javascript 字符串吗？

Question

所以我正在编写这个 node.js 应用程序，我试图让它超快并且内存占用少。我有很多字符串连接正在进行，功能如下:

function f(pt) { 
    return pt.x + ' + ' + pt.y; 
}

如果我在我的应用程序的内部循环中执行了大约 1 亿次，Javascript 引擎是否分配并且必须释放该字符串 ' + ' 1 亿次？将这段代码重写为类似的东西在内存方面会更高效吗

var plus = ' + ';
function f(pt) { 
    return pt.x + plus + pt.y; 
}

或者编译器只是在后台执行此操作，还是根本不重要？ (我的代码实际上使用了比“+”长得多的字符串，我只是以此为例。)

Answer 1

视情况而定。

但老实说，它可能会慢一点。
这是因为它必须在函数范围内搜索变量 plus，然后是窗口对象，然后在上面的范围内才能找到它。

所以，我相信它可能会更慢。

考虑以下代码:

console.time('plus outside');
var plus=' x ', fn=function(pt){return pt.x + plus + pt.y};
for(var i=0; i<1e5; i++){ fn({x:5,y:6}); }
console.timeEnd('plus outside');

还有这段代码:

console.time('plus inside');
var fn=function(pt){return pt.x + ' + ' + pt.y};
for(var i=0; i<1e5; i++){ fn({x:5,y:6}); }
console.timeEnd('plus inside');

同时在 Google Chrome v41.0.2272.89 m 上运行，plus outside 花费了 200ms 而 inside 花费了 175ms!
快了 25%!

在下面，您可以看到时间大致相同的打印屏幕:

你也可以在你的电脑上测试它!

window.onload=function(){

	(function(elem){
		
		var plus=' + ',fn=function(pt){return pt.x + plus + pt.y}, start=new Date();
      
		for(var i=0; i<1.5e7; i++){ fn({x:5,y:6}); };
		var end=new Date();
		
		elem.innerHTML=(end-start)+'ms (i:'+i+')';
		
	})(document.getElementById('plus_outside'));
  
  
  
	
	(function(elem){
		
		var fn=function(pt){return pt.x + ' + ' + pt.y}, start=new Date();
      
		for(var i=0; i<1.5e7; i++){ fn({x:5,y:6}); };
		var end=new Date();
		
		elem.innerHTML=(end-start)+'ms (i:'+i+')';
		
	})(document.getElementById('plus_inside'));
  
  
	
	(function(elem){
		
		var fn=function(pt){return [pt.x,'+',pt.y].join(' ')}, start=new Date();
      

		for(var i=0; i<2e5; i++){ fn({x:5,y:6}); };
		var end=new Date();
		
		elem.innerHTML=(end-start)+'ms (i:'+i+')';
		
	})(document.getElementById('array'));
  
  
  	(function(elem){
		
		var fn=function(pt){return [pt.x,' + ',pt.y].join('')}, start=new Date();
      

		for(var i=0; i<2e5; i++){ fn({x:5,y:6}); };
		var end=new Date();
		
		elem.innerHTML=(end-start)+'ms (i:'+i+')';
		
	})(document.getElementById('array_nojoin'));
  
  
  
   (function(elem){
		
		var fn=function(pt){return ([pt.x,'+',pt.y]+'').replace(',',' ')}, start=new Date();
      

		for(var i=0; i<2e5; i++){ fn({x:5,y:6}); };
		var end=new Date();
		
		elem.innerHTML=(end-start)+'ms (i:'+i+')';
		
	})(document.getElementById('array_replace'));
  

};

<font face="sans-serif">
<p>
  Plus inside: <span id="plus_inside"></span><br>
  &nbsp;&nbsp;fn: <code>function(pt){return pt.x + ' + ' + pt.y}</code>
</p>

<p>
  Plus outside: <span id="plus_outside"></span><br>
  &nbsp;&nbsp;fn: <code>function(pt){return pt.x + plus + pt.y}</code>
</p>

<p>
  Array: <span id="array"></span><br>
  &nbsp;&nbsp;fn: <code>function(pt){return [pt.x,'+',pt.y].join(' ')}</code>
</p>

<p>
  Array (no join): <span id="array_nojoin"></span><br>
  &nbsp;&nbsp;fn: <code>function(pt){return [pt.x,' + ',pt.y].join('')}</code>
</p>


<p>
  Array (replace comas): <span id="array_replace"></span><br>
  &nbsp;&nbsp;fn: <code>function(pt){return ([pt.x,'+',pt.y]+'').replace(',',' ')}</code>
</p>
</font>