Javascript reverse在循环中不起作用

如何解决Javascript reverse在循环中不起作用

我有以下Web服务调用，用于在UI中填充下拉菜单。如果不使用Array的createDate方法，则Web服务会以越来越多的reverse()形式获取这些记录。因此，我决定以以下方式使用它：

$.ajax({
        beforeSend: function(request) {
            request.setRequestHeader("eppn",emailID+"@abc.com");
          },url: 'http://localhost:8080/Services/getUserByDate?userid=JACK',type : 'GET',dataType:'json',success : function(data) {
                console.log("Sept 18 : Testing getUserByDate webservice");  
                console.log(data.usersList.reverse());
                $.each(data.usersList.reverse(),function (i) { 
                $("#userSetList").append('<option><a href="#" >'+data.usersList[i].title+' | '+data.usersList[i].userSetId+' | '+moment(data.usersList[i].createDate).format('MM/DD/YYYY')+'</a></option>');
                            
                });
        },error : function(request,error)
        {
             $.growl.error({title: "Error",message: "Webservice request Failed!" });
        }
});

并注意到以下内容：

console.log("Sept 18 : Testing getUserByDate webservice");  
    console.log(data.usersList.reverse());

以上代码按预期显示了反转格式的项目。但是，当我测试以下内容时：

$.each(data.usersList.reverse(),function (i) { 
    $("#userSetList").append('<option><a href="#" >'+data.usersList[i].title+' | '+data.usersList[i].userSetId+' | '+moment(data.usersList[i].createDate).format('MM/DD/YYYY')+'</a></option>');
});

在用户界面下拉菜单中未按相反顺序显示项目。为什么？

解决方法

reverse将数组反转，然后返回它。

在您的代码中，调用console.log(data.usersList.reverse());时先反转数组，然后再调用$.each(data.usersList.reverse(),...。由于您要反转两次相同的数组，因此它会恢复为其原始顺序。

相反，您可以拨打一次reverse，然后直接使用data.userList进行后续通话：

// data.userList is reversed in place
data.usersList.reverse();
console.log(data.userList);
$.each(data.usersList,function (i) { 
    $("#userSetList").append('<option><a href="#" >'+data.usersList[i].title+' | '+data.usersList[i].userSetId+' | '+moment(data.usersList[i].createDate).format('MM/DD/YYYY')+'</a></option>');        
});

array.reverse（）没问题。

const
  mySelect = document.getElementById('my-select'),data =
    [ { val:'a',lib:'a_lib' },{ val:'b',lib:'b_lib' },{ val:'c',lib:'c_lib' },{ val:'d',lib:'d_lib' }
    ]
    
data.reverse().forEach(el=>{ mySelect.add( new Option(el.lib,el.val)) })

<select id="my-select"></select>