如何更改数组的索引顺序？答案

【问题标题】：How can I change the index order of an array?如何更改数组的索引顺序？
【发布时间】：2016-12-05 09:35:00
【问题描述】：

我有一个按钮，它有一个名为 clickNext() 的函数。每当单击该按钮时，它都会增加名为“arr1”的数组上的索引位置（scope.selected）。

<button type="button" class="right-btn col-xs-6" role="menuitem" ng-click="clickNext()">Next</button>

function clickNext()
        {
            scope.selected = (scope.selected + 1) % length;
        }


arr1 = [
        {apple: 1 , tango},
        {banana: 3, kappa},
        {orange:5, alpha},
        {apple: 8 , beta},
        {grape: 10 , sigma}
        ]

问题

我有一个与 arr1 相同的数组，称为“arr2”。我想要做的是让 clickNext() 基于 arr2 数组 而不是 arr1 数组递增到下一个索引位置。

现在，clickNext 函数仍然按照 arr1 数组的顺序递增。例如，如果我要单击按钮，它将从橙色：5 开始，然后移动到苹果 8，等等。

arr2 = [
        {orange:5, alpha},
        {apple: 8 , beta},
        {banana: 3, kappa},
        {grape: 10 , sigma},
        {apple: 1 , tango}
        ]

我的尝试 我完成此操作的过程是使用 findIndex() 函数并将 arr2 项目与 arr1 项目匹配。这不起作用，但也许我的结构有误？

  clickNext(){
   var oldIndex = filteredToXs(scope.selected);
   scope.selected = oldIndex + 1;}

function filteredToXs( filteredIndex ) {
  var firstArr = scope.arr1[ filteredIndex ];
  var xsIndex = scope.arr2.findIndex( function(item) {
  return item.trackingNumber === firstArr.trackingNumber;
 } );
if( xsIndex >= 0 ) return xsIndex;
if( xsIndex === -1 ) return 0;  // Default value
 }

【问题讨论】：

我不明白你为什么不直接使用第二个数组。尝试在它们之间进行交叉引用有什么好处？
为了简单起见，在示例中。它在代码中被映射出来，但是为了引用目的，数组必须是分开的。

标签： javascript arrays sorting indexing

【解决方案1】：

希望我正确理解了您的问题。请同时阅读我在代码部分中的 cmets。

我必须修改您的源代码，以便为您创建一个小提琴。

HTML：我更改了点击事件并删除了一个不可用的 css 类

<button type="button" role="menuitem" onclick="clickNext();">Next</button>

样本数组：它们包含无效对象：我将 alpha、beta、tango、.. 更改为一个属性。您也可以将它们定义为值.. 这无关紧要：

var arr1 = [
    { apple: 1, tango: '' },
    { banana: 3, kappa: '' },
    { orange: 5, alpha: '' },
    { apple: 8, beta: '' },
    { grape: 10, sigma: '' }];

var arr2 = [
    { orange: 5, alpha: '' },
    { apple: 8, beta: '' },
    { banana: 3, kappa: '' },
    { grape: 10, sigma: '' },
    { apple: 1, tango: '' }];

代码：

var idx = 0;    //save current index of array 2

function clickNext() {
    idx++;

    //I'm comparing the array objects using a string compare- this only works because you said 'I have an identical array'
    //this may cause issues if you're objects are cross-referenced
    var find = function(array, obj) {   //lookup value from arr2 in arr1
        for (var i=0, l=array.length;i<l;i++)
            if (JSON.stringify(array[i]) == JSON.stringify(obj))    //adjust this line to your needs
                return array[i];
    }
    var result = find(arr1, arr2[idx])
    if (!result)
        throw new Error('not found- your arrays are not identical or you run out of index');
    console.log(result);
}

小提琴：https://jsfiddle.net/k50y8pp5/

【讨论】：