Eliminate multiple elements from an array based on their index positions, and then save the

Question

Eliminate multiple elements from an array based on their index positions, and then save the

What is the most efficient way to remove multiple items by index and save them in arrays actives and availables? I need to move selected elements from a ListBox, represented as selectedValues = [1, 4, 2].

Here's my proposed solution:

var actives = [ "a", "d", "k", "e"]
var availables = [ "m", "o", "v" ]
var selectedValues = [3, 1]
var elementsToMove = []

selectedValues.forEach(i => {
  elementsToMove.push(actives[i])
})

actives = actives.filter(item => !elementsToMove.includes(item))
availables = availables.concat(elementsToMove);

console.log(actives);
console.log(availables);

Expected result:

actives = [ "a", "k" ]
availables = [ "m", "o", "v", "e", "d"]

Note: The size of the arrays can vary greatly.

javascript typescript

Answer 1

Answer №1

Using a .filter with an .includes within can result in a computational complexity of O(n ^ 2), especially for large inputs. To mitigate this, consider transforming the elementsToMove into a Set to reduce the overall complexity to O(n). Additionally, you can streamline the creation of the elementsToMove array by utilizing .map instead of combining forEach and push:

var actives = [ "a", "d", "k", "e"]
var availables = [ "m", "o", "v" ]
var selectedValues = [3, 1];
const elementsToMove = selectedValues.map(i => actives[i]);
const elementsToMoveSet = new Set(elementsToMove);

actives = actives.filter(item => !elementsToMoveSet.has(item))
availables = availables.concat(elementsToMove);

console.log(actives);
console.log(availables);

Answer 2

Using a .filter with an .includes within can result in a computational complexity of O(n ^ 2), especially for large inputs. To mitigate this, consider transforming the elementsToMove into a Set to reduce the overall complexity to O(n). Additionally, you can streamline the creation of the elementsToMove array by utilizing .map instead of combining forEach and push:

var actives = [ "a", "d", "k", "e"]
var availables = [ "m", "o", "v" ]
var selectedValues = [3, 1];
const elementsToMove = selectedValues.map(i => actives[i]);
const elementsToMoveSet = new Set(elementsToMove);

actives = actives.filter(item => !elementsToMoveSet.has(item))
availables = availables.concat(elementsToMove);

console.log(actives);
console.log(availables);

Answer 3

Answer №2

To efficiently move elements from one array to another, you can use a single loop and push the spliced elements to the target array.

var sourceArray = [ "apple", "banana", "cherry", "date"],
    destinationArray = [ "mango", "orange", "pear" ],
    indexesToMove = [2, 0];

indexesToMove.forEach(index => destinationArray.push(...sourceArray.splice(index, 1)));

console.log(sourceArray);
console.log(destinationArray);

Answer 4

To efficiently move elements from one array to another, you can use a single loop and push the spliced elements to the target array.

var sourceArray = [ "apple", "banana", "cherry", "date"],
    destinationArray = [ "mango", "orange", "pear" ],
    indexesToMove = [2, 0];

indexesToMove.forEach(index => destinationArray.push(...sourceArray.splice(index, 1)));

console.log(sourceArray);
console.log(destinationArray);

Eliminate multiple elements from an array based on their index positions, and then save the

Answer №1

Answer №2

Similar questions

Maintaining the Syntax when Copying HTML to a Text Area

new cookies are created without human intervention

Alter the border line's color based on the specific section or div it overlays

What is the best way to create a menu that can be hovered over but not clicked on

The CSS link will only appear when hovering over the image

Angular model does not bind properly to Bootstrap 3 DateTimePicker after 'dp.change' event

Start the Vue component only after ensuring that the element has been fully loaded

Display a loading component within the navbar in React while waiting for data to be retrieved

When trying to use preact as an alias for react, the error "Module not found: 'react/jsx-runtime'" is thrown

Storing data in MongoDB upon the emission of a Socket.io event

Can you please explain the purpose of the state object in the setSearchParams hook of react-router-dom v6

No data being fetched through Ajax

Is there a way to change the visibility of a form element within a directive with the help of

Adding a fresh selection to the Bootstrap menu

What could be the reason behind encountering a "Cannot return null for non-nullable field" error while attempting a mutation?

Converting Javascript tools into Typescript

Displaying variables in JavaScript HTML

The success callback in JQuery Ajax does not function properly when constructing an array of Ajax calls

In a Django template, implement a checkbox feature in the list view to select multiple objects. Retrieve all selected checkbox objects for each pagination and display them in

Unveiling the Power of KnockoutJS: Displaying HTML Content and Populating