为什么全局变量没有改变

why global variable is not changed?

本文关键字:改变 全局变量 为什么      更新时间:2023-09-26

全局变量不会更改其值。具体来说,pageNumber 保持为 1,它应该在函数中递增。我尝试实现连续滚动并获取下一个代码块,在我的 asp.net mvc 控制器中使用 post query to action,但它当然总是给我相同的结果

<script type="text/javascript">
	pageNumber = 1; //Infinite Scroll starts from second block
	noMoreData = false;
	inProgress = false;
	function ScrollFunction(pageNumber, noMoreData, inProgress) {
		var documentHeight = $(document).height();
		var windowHeight = $(window).height();
		var windowScrollTop = $(window).scrollTop();
		var documentMinusWindowHeight = documentHeight - windowHeight;
		//-1 because when scroll reaches the bottom of the document windowScrollTop - documentHeightMinusWindowHeight equals from zero to 1
		if ((windowScrollTop > documentMinusWindowHeight - 1) && !noMoreData && !inProgress) {
			inProgress = true;
			$("#loadingDiv").show();
			$.post("@Url.Action("InfiniteScroll", "Products")", { "productId": '@Model.ProductViewModel.Id', "pageNumber": pageNumber },
		function (data) {
			pageNumber++;
			noMoreData = data.NoMoreData;
			$("#ProductDealsPartialDiv").append(data.HtmlString);
			$("#loadingDiv").hide();
			inProgress = false;
		});
	}
	}
	$(document).ready(function () {
		//var pageNumber = 1; 
		//var noMoreData = false;
		//var inProgress = false;
		ScrollFunction(pageNumber, noMoreData, inProgress);
		$(window).scroll(function () {
			ScrollFunction(pageNumber, noMoreData, inProgress);
		});
	});
</script>

但是这个代码片段是绝对正确的。

<script type="text/javascript">
	$(document).ready(function () {
		var pageNumber = 1; //Infinite Scroll starts from second block
		var noMoreData = false;
		var inProgress = false;
		$(window).scroll(function () {
			var documentHeight = $(document).height();
			var windowHeight = $(window).height();
			var windowScrollTop = $(window).scrollTop();
			var documentMinusWindowHeight = documentHeight - windowHeight;
			//-1 because when scroll reaches the bottom of the document windowScrollTop - documentHeightMinusWindowHeight equals from zero to 1
			if ((windowScrollTop > documentMinusWindowHeight - 1) && !noMoreData && !inProgress) {
				inProgress = true;
				$("#loadingDiv").show();
				$.post("@Url.Action("InfiniteScroll", "Products")", { "productId": '@Model.ProductViewModel.Id', "pageNumber": pageNumber },
					function (data) {
						pageNumber++;
						noMoreData = data.NoMoreData;
						$("#ProductDealsPartialDiv").append(data.HtmlString);
						$("#loadingDiv").hide();
						inProgress = false;
					});
			}
		});
	});
</script>
请解释为什么会发生这种情况。谢谢。

这是因为函数ScrollFunction的第一个参数称为pageNumber

因此,当您调用它时,该函数会操作其名为 pageNumber 的局部变量,该变量不是全局变量。整数或字符串等原始类型不是通过引用传递,而是通过值传递,这意味着更改本地pageNumber不会影响全局类型。

请看这些例子:

function change(glob) {
  glob = 2;
}
var glob = 1;
change(glob);

在此调用之后,glob 仍然等于 1,这就是代码中发生的情况。事实上,我们决定将这个论点称为"glob",但它可以是任何东西:

function change(localParameter) {
  localParameter = 2;
}
var glob = 1;
change(glob);

在这个例子中,我假设你理解调用change不应该影响你的全局变量。那么,即使变量名称相同,上面也发生了完全相同的情况。

现在为了避免这种情况并直接处理全局变量,您所要做的就是使用函数中的变量,而不是通过参数传递它:

function change() {
  glob = 2;
}
var glob = 1;
change();

现在 glob 等于 2,因为该函数可以直接访问其范围之上的变量。我们称之为闭合变量。

了解有关按值传递和按引用传递的信息。

当您使用 pageNumber 值调用方法时,它是按值传递的,这意味着它会创建值的本地副本,而不是更改原始变量。

在JS中,您需要传递一个对象来实现按引用传递,并能够从函数中更改其值。