How to insert and delete elements from an array by position, while updating positions

Question

I have an array of objects with a position property along with other properties like this:

[{position: 1, ...otherProperties}, ...otherObjects]

In the frontend, the objects are displayed and sorted by their position.

I am looking for JavaScript functions to perform the following operations:

Insert a new object at a specified position (e.g., before the element with position: 1) and update the positions of the other elements accordingly (e.g., previous position: 1 element will now be position: 2).
Delete an object from a specified position and update the positions of the remaining elements accordingly.

I am struggling with the creation of these functions

"I have tried to create a function that does something like this but couldn't get it." post that and describe your one challenge with that so we may best assist you here.. Not really enough details here to allow us to help you very well. — Mark Schultheiss
– Mark Schultheiss, Commented Apr 10, 2023 at 20:06
Adding/deleting elements at certain locations in an array covered by Array.splice. — James
– James, Commented Apr 10, 2023 at 20:08
Don't store the position as an object property since it seems you always want the position to reflect the index of the array anyway, or implement a linked list. — pilchard
– pilchard, Commented Apr 10, 2023 at 20:41

Moshe · Accepted Answer · 2023-04-10 20:04:38Z

1

You can create two functions addElement and removeElement to add or delete elements in your array, while ensuring the positions are sorted correctly. For example:

function addElement(arr, newPosition, newElement) {
  // Add a new element at the given position
  newElement.position = newPosition;
  arr.push(newElement);

  // Sort the array by position
  arr.sort((a, b) => a.position - b.position);

  // Update the position of elements
  arr.forEach((item, index) => {
    item.position = index + 1;
  });

  return arr;
}

function removeElement(arr, positionToRemove) {
  // Remove the element from the given position
  arr = arr.filter(item => item.position !== positionToRemove);

  // Update the remaining elements' positions
  arr.forEach((item, index) => {
    item.position = index + 1;
  });

  return arr;
}

Usage:

let array = [
  { position: 1, prop: "a" },
  { position: 2, prop: "b" },
  { position: 3, prop: "c" },
];

let newArray = addElement(array, 1, { prop: "d" });
console.log(newArray);

newArray = removeElement(newArray, 3);
console.log(newArray);

answered Apr 10, 2023 at 20:04

Moshe

2,6744 gold badges30 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Mark Schultheiss Over a year ago

Please don't encourage poorly asked questions by attempting to answer them.

Moshe Over a year ago

@MarkSchultheiss edited the Q. Trying to be more welcoming :)

pilchard Over a year ago

don't push if you know the index of insertion, just splice() and on removal you can do the same and only re-position from that index on.

Awesh Choudhary Over a year ago

Thank you @moshe for answer this helped me to fix my issue

Pipo Bizelli · Accepted Answer · 2023-04-10 20:10:53Z

1

You need a method that parse all items of your array and set the new position to all of it.

function fixPosition(arr) {
  arr.map((o, i) => o.pos = i+1)
  return arr
}

answered Apr 10, 2023 at 20:10

Pipo Bizelli

1522 silver badges12 bronze badges

Collectives™ on Stack Overflow

How to insert and delete elements from an array by position, while updating positions

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related