更改对象数组的顺序

Changing order of object array

本文关键字：顺序 数组 对象      更新时间：2023-09-26

我有一个对象数组，如下所示：

var array = [
    { name: "A", position: "0" },
    { name: "B", position: "1" },
    { name: "C", position: "2" },
    { name: "D", position: "3" },
    { name: "E", position: "4" },
    { name: "F", position: "5" }
];

假设用户拖动了位置为4的元素，并将其放置在位置为1的元素上。

var replacedItem = { name: "E", position: "4" };
var destinationItem = { name: "B", position: "1" };

如何使用javascript重新排列元素的位置，使数组包含以下值：

var array = [
    { name: "A", position: "0" },
    { name: "E", position: "1" },
    { name: "B", position: "2" },
    { name: "C", position: "3" },
    { name: "D", position: "4" },
    { name: "F", position: "5" }
];

谢谢，

1-destionNationItemIndex

4-替换条目索引

你可以试试这个：-

var removed = array.splice(4, 1);
array.splice(1, 0, removed[0]);
for (var i = 1; i <= 4; i++) {
    array[i].position = (parseInt(array[i - 1].position) + 1).toString();
}

打印您需要的内容：-

var array = [
    { name: "A", position: "0" },
    { name: "E", position: "1" },
    { name: "B", position: "2" },
    { name: "C", position: "3" },
    { name: "D", position: "4" },
    { name: "F", position: "5" }
]

您可以使用splice分两步移动元素：

var a = [ ... ];
var temp = a.splice(4, 1); // remove element at index 4
a.splice(1, 0, temp[0]);   // insert the removed element at index 1

splice()返回一个已移除元素的数组（在本例中，是一个单元素数组），这就是为什么需要给temp加下标的原因。

由于您只想移动name属性，一种方法是将数组分离为两个数组，重新排列与name属性对应的数组，然后重新组合：

var fromIndex = 4, toIndex = 1;
// Step 1: collect names and positions in separate arrays
var names = [], positions = [];
array.forEach(function(elt) {
        this.names.push(elt.name);
        this.positions.push(elt.position);
    }, {names: names, positions: positions});
// Step 2: do a circular permutation of the names between the indexes (inclusive)
var temp = names.splice(fromIndex, 1);
names.splice(toIndex, 0, temp[0]);
// Step 3: recombine names and positions into an array of objects
var n = array.length;
array.length = 0;
for (var i = 0; i < n; ++i) {
    array.push({name: names[i], position: positions[i]});
}

以下是实现这一点的最简单逻辑：

var array = [
    { name: "A", position: "0" },
    { name: "B", position: "1" },
    { name: "C", position: "2" },
    { name: "D", position: "3" },
    { name: "E", position: "4" },
    { name: "F", position: "5" }
];
var replacedItem = { name: "E", position: "4" };
var destinationItem = { name: "B", position: "1" };
for(var i=0; i<array.length; i++){
    if(array[i].position == replacedItem.position)
        array[i].position = destinationItem.position;
    else if(array[i].position == destinationItem.position)
        array[i].position = replacedItem.position;
}

新阵列将是：

var array = [
        { name: "A", position: "0" },
        { name: "B", position: "4" },
        { name: "C", position: "2" },
        { name: "D", position: "3" },
        { name: "E", position: "1" },
        { name: "F", position: "5" }
    ];

你只需要交换他们的头寸。

DEMO

相关文章：