Javascript:避免在涉及大量循环的代码中使用全局变量

Question

我遇到了一个非常令人困惑的问题。我认为最好用代码来解释：

var length = 0; // I want to avoid this variable being global
function loop(array, func) {
	for (var i = 0; i < array.length; i++) {
		array[i].func(length);
		length += array[i].number;
		if (func) {
			func();
		}
	}
}
function bar(number) {
	this.func = function(len) {
		console.log(len);
	};
	this.number = number;
}
function main() {
	var array = [];
	for (var j = 1; j < 3; j++) {
		var foo = new bar(j);
		array.push(foo);
	}
	loop(array, function() {
		loop(array);
	});
}
main();

我在其他一些代码中有一个与此类似的循环。我根本无法弄清楚如何使长度变量在此代码中本地化。我无法将其传递给函数，因为它调用自身。我真的无法将它移动到任何地方，因为循环不断搞砸。

感谢您的任何帮助！

Answer 1

我假设您想在循环的连续函数调用之间保持长度值。您可以通过返回使用该长度的闭包来执行此操作。因此，您可以执行以下操作，而不是像当前那样定义循环：

const loop = (function() {
var length = 0;
return function (array, func) {
// Your current code for loop here
}
}) ();

基本上，这样做是将循环分配为从另一个匿名函数调用返回的函数。这可确保长度值持续存在，因为它是在最终分配给循环的函数范围之外定义的，但在代码中的其他任何地方都完全无法访问。

Answer 2

不确定你想用这一切完成什么，但看起来main是loop的调用者，所以你可以让length成为loop的参数，并让main调用初始length为 0 的loop并让loop和回调返回更改后的lengths：

function loop(array, length, func) {
for (var i = 0; i < array.length; i++) {
array[i].func(length);
length += array[i].number;
if (func) {
length = func(length);
}
}
return length;
}
function bar(number) {
this.func = function(len) {
console.log(len);
};
this.number = number;
}
function main() {
var array = [];
for (var j = 1; j < 3; j++) {
var foo = new bar(j);
array.push(foo);
}
loop(array, 0, function(newLen) {
return loop(array, newLen);
});
}
main();

Answer 3

Keveloper的回答对你来说是个好主意。我建议你先试试这种方式。

这是避免全局变量的另一种方法，该方法也可能有效。

function loop(array, func, data) {
	for (var i = 0; i < array.length; i++) {
		array[i].func(data.length);
		data.length += array[i].number;
		if (func) {
			func(data);
		}
	}
}
function bar(number) {
	this.func = function(len) {
		console.log(len);
	};
	this.number = number;
}
function main() {
	var array = [];
	for (var j = 1; j < 3; j++) {
		var foo = new bar(j);
		array.push(foo);
	}
	loop(array, function (data) {
		loop(array, null, data);
	}, { length: 0 });
}
main();

您可以将长度作为参数传递loop。但不是直接的，使用对象来包装它，所以它通过引用传递。