How to reorder an array of objects using other array that has index and returns the new ordered arra-CodePudding

What I want exactly is a function that we can pass two arrays, one the original array of objects with specific order, and the other is an array of objects that has the new target index so the function will return the original array to new order based on the indexes

For example : this is how the original array will look like

const columns=[
      {

        field: "name",
        type: "action",
        width: settings.defaultColumnWidth,
      },
      {
        field: "country",
        type: "action",
        width: settings.defaultColumnWidth,
      
      },
      {
        field: "phone",
        type: "action",
        width: settings.defaultColumnWidth,            
      },
      {
        field: "email",
        type: "action",
        width: settings.defaultColumnWidth,
        
      },
    ]

And the other array that have objects with fields name and the target index to be ordered

const newOrder = [
  {
    field: "country"
    oldIndex: 1
    targetIndex: 2
  },
]

So the new array that should be returned from the function will be like this

  const columns=[
  {

    field: "name",
    type: "action",
    width: settings.defaultColumnWidth,
  },
  {
    field: "phone",
    type: "action",
    width: settings.defaultColumnWidth,            
  },
  {
    field: "country",
    type: "action",
    width: settings.defaultColumnWidth,

  },
  {
    field: "email",
    type: "action",
    width: settings.defaultColumnWidth,

  },
]

I hope my question is clear, thanks in advance for your help

CodePudding user response：

Assuming there won't be too much contradiction, I think splice and such should work.

var settings = {
  defaultColumnWidth: 12
}

const columns = [{
    field: "name",
    type: "action",
    width: settings.defaultColumnWidth
  },
  {
    field: "country",
    type: "action",
    width: settings.defaultColumnWidth
  },
  {
    field: "phone",
    type: "action",
    width: settings.defaultColumnWidth
  },
  {
    field: "email",
    type: "action",
    width: settings.defaultColumnWidth
  }
]

const newOrder = [{
    field: "country",
    oldIndex: 1,
    targetIndex: 2
  }
];



newOrder.forEach(function(item) {
  var field = item.field
  var targetIndex = item.targetIndex
  for (var i = 0; i < columns.length; i  ) {
    var column = columns[i];
    if (column.field == field) {
      var elem = columns.splice(i, 1)[0];
      columns.splice(targetIndex, 0, elem);
      break;
    }
  }
})

console.log(columns);

.as-console-wrapper {
  max-height: 100% !important;
  top: 0;
}

CodePudding user response：

Here is a simple version

Array.prototype.move = function(from, to) { this.splice(to, 0, this.splice(from, 1)[0]);};
const columns = [{ field: "name", type: "action", width: "settings.defaultColumnWidth", }, { field: "country", type: "action", width: "settings.defaultColumnWidth", }, { field: "phone", type: "action", width: "settings.defaultColumnWidth", }, { field: "email", type: "action", width: "settings.defaultColumnWidth", }, ];
const newOrder = [{ field: "country", oldIndex: 1, targetIndex: 2 } ];

newOrder.forEach(({ field, oldIndex, targetIndex }) => columns[oldIndex].field === field &&  columns.move(oldIndex,targetIndex));

console.log(columns)

CodePudding user response：

You can achieve this with swapping technique.

var settings = {
  defaultColumnWidth: 6
}

const columns=[
    {

        field: "name",
        type: "action",
        width: settings.defaultColumnWidth,
    },
    {
        field: "country",
        type: "action",
        width: settings.defaultColumnWidth,
      
    },
    {
        field: "phone",
        type: "action",
        width: settings.defaultColumnWidth,            
    },
    {
        field: "email",
        type: "action",
        width: settings.defaultColumnWidth,
    },
];
    
const newOrder = [
    {
        field: "country",
        oldIndex: 1,
        targetIndex: 2
    },
];

newOrder.forEach(function(order) {
  // swapping
  let temp = columns[ order['targetIndex'] ];
  columns[ order['targetIndex'] ] = columns[ order['oldIndex'] ];
  columns[ order['oldIndex'] ] = temp;
});

console.log( columns );