JavaScript 堆栈、LIFO 堆栈：值与预期不符

Question

我有以下代码。

var stackMapIn = [];
var stackMapOut = [];
var stackBack = [];

stackMapOut.push("m1");

$scope.clickLinks = function(initialOut,initialIn,extra,backIn,backOut,name){
        $('div#'+initialOut+'Map,'+extra).fadeOut('slow',function(){
            $('.'+initialOut+'Details,.bkbtn'+backOut).css("display","none");
            $('.'+initialIn+'Details,.bkbtn'+backIn).css("display","block");
            $('.noQuery').css("display","none");
            $("#buildingHeader").html(name);
            $('div#'+initialIn+'Map').fadeIn('slow');
        })

    stackMapOut.push(initialIn);
    stackMapIn.push(initialOut);
    stackBack.push(backIn);
}

$scope.clickBack = function(bkbtnCheck){
    alert(stackBack[0]);
    mapOut = stackMapOut.pop();
    mapIn = stackMapIn.pop();
    stackBack.pop();
    backIn = stackBack[0];
    alert(backIn);

    $('div#'+mapOut+'Map').fadeOut('slow',function(){
        $('.'+ mapOut + 'Details,.bkbtn').css("display", "none");
        $('.' + mapIn + 'Details,.bkbtn'+backIn).css("display", "block");
        $(".noQuery").css("display","none");
        $("#buildingHeader").html("Name");
        $('div#' + mapIn + 'Map').fadeIn('slow');
    })
}

现在我将快速浏览一下这段代码运行时会发生什么。

第一次 clickLinks 运行：

initialIn = 'm2'

initialOut = 'm1'

backIn = '首页'

clickBack 尚未运行。

clickLinks 第二次运行：

initialIn = 'm7'

initialOut = 'm2'

backIn = 'CentralPortfolio'

好的，现在事情应该是这样的（我期望）：

stackMapOut = ['m1','m2','m7']

stackMapIn = ['m1','m2']

stackback = ['Home','CentralPortfolio']

现在我们运行clickBack...为什么警报输出“Home”？？

我在这里要做的是，当 clickLinks 运行时，我有一系列的东西出现和消失。有时，用户可以运行 clickBack 以返回到之前的状态（状态）。因此，我使用 JavaScript 堆栈 来跟踪它所处的状态以及它需要返回的位置。

问题是，我可以运行一次clickLinks，连续一次clickBack 没有问题。我什至可以再次运行 clickLinks 并且仍然单击返回按钮 2 次（返回开始）而不会出现问题。但是我仍然不明白为什么 stackBack[0] （应该是堆栈的顶部？） = "Home" 在这一点上而不是 "CentralPortfolio"。

因为我现在遇到的真正问题是，如果我第三次运行 clickLinks：仍然是 stackBack[0] = 'Home'（当我期望它此时为“CentralCampus”），因此，显示的是“主页”后退按钮（而正确的其他内容根据 mapOut 和 mapIn 显示) 而不是显示 CentralPortfolio 的后退按钮；因为我在使用它之前已经“弹出”了“CentralCampus”。

---

如果需要任何其他信息或您需要更多说明，请告诉我。我已尽力提供任何需要的信息并尽可能清楚地说明。

Answer 1

现在我们运行 clickBack... 为什么警报输出“Home”？？`

因为stackBack[0] 是Home。你希望它做什么？你甚至在你的问题中有它：

stackback = ['Home','CentralPortfolio']

索引0 是数组中的第一个元素，即Home。最后一个元素是stackBack[stackBack.length - 1]

使用 JavaScript 堆栈

不，您使用的是 javascript 数组，但将其用作堆栈。除非你像数组一样索引它 - 这是你困惑的根源。您可以将其用作pop 和push 的堆栈，但不要尝试使用[] 对其进行索引

当您在数组上push 时，您将一个元素添加到数组的末尾。换句话说，它最终成为索引yourArray.length - 1 处的最后一个元素。当您pop 时，您再次将最后一个元素从数组中取出。所以弹出stackback 会返回CentralPortfolio，当然，第一个元素没有改变。