Working with arrays in JavaScript objects

Question

Working with arrays in JavaScript objects

I have an object with arrays nested inside, as shown in the example below:

{1: Array(4), 2: Array(4), 3: Array(4)}
1: (4) ["11111", "2020-04-02", "14:07", 1]
2: (4) ["22222", "2020-04-02", "14:07", 2]
3: (4) ["3333333", "2020-04-02", "14:07", 3]
(from console log)

In my code, there is an option to add and delete arrays. If I delete the second array for example, it will become like this:

{1: Array(4), 3: Array(4)}
1: (4) ["11111", "2020-04-02", "14:07", 1]
3: (4) ["3333333", "2020-04-02", "14:07", 3]
(from console log)

How can I make the third object become number 2? I want the object to be managed from lowest to highest numbers. Thank you.

javascript arrays object

Answer 1

Answer №1

By converting your object into an array-like structure, you unlock the ability to utilize array methods on it.

An object that is considered array-like must contain a `length` property and keys that are positive integers. The value of `length` should be one more than the highest index present in the object. For example, if your object has keys `1, 2, 3`, then `length: 4` is needed. Despite there being only three elements, `length` essentially represents the "next available index."

Upon transforming your object, you can apply Array#splice by utilizing Function#call. Many array methods operate generically to accommodate any array-like data structure:

const obj = {
  1: ["foo"],
  2: ["bar"],
  3: ["baz"],
  length: 4
}

//delete starting from index 2 and remove 1 item
Array.prototype.splice.call(obj, 2, 1)

console.log(obj);

Observe how the indexes shift after deletion and the `length` automatically adjusts accordingly.

If unsure about the current `length`, it can be easily determined:

const obj = {
  1: ["foo"],
  2: ["bar"],
  3: ["baz"]
}


const keys = Object
  .keys(obj)   //get all keys
  .map(Number) //convert to numbers
  .filter(key => Number.isInteger(key) && key >= 0); //leave only positive integers

//find the highest
const highestKey = keys.reduce((a, b) =>  Math.max(a, b), -1);

//set the length to the next possible index
obj.length = highestKey + 1;

//delete starting from index 2 and remove 1 item
Array.prototype.splice.call(obj, 2, 1)

console.log(obj);

Answer 2

By converting your object into an array-like structure, you unlock the ability to utilize array methods on it.

An object that is considered array-like must contain a `length` property and keys that are positive integers. The value of `length` should be one more than the highest index present in the object. For example, if your object has keys `1, 2, 3`, then `length: 4` is needed. Despite there being only three elements, `length` essentially represents the "next available index."

Upon transforming your object, you can apply Array#splice by utilizing Function#call. Many array methods operate generically to accommodate any array-like data structure:

const obj = {
  1: ["foo"],
  2: ["bar"],
  3: ["baz"],
  length: 4
}

//delete starting from index 2 and remove 1 item
Array.prototype.splice.call(obj, 2, 1)

console.log(obj);

Observe how the indexes shift after deletion and the `length` automatically adjusts accordingly.

If unsure about the current `length`, it can be easily determined:

const obj = {
  1: ["foo"],
  2: ["bar"],
  3: ["baz"]
}


const keys = Object
  .keys(obj)   //get all keys
  .map(Number) //convert to numbers
  .filter(key => Number.isInteger(key) && key >= 0); //leave only positive integers

//find the highest
const highestKey = keys.reduce((a, b) =>  Math.max(a, b), -1);

//set the length to the next possible index
obj.length = highestKey + 1;

//delete starting from index 2 and remove 1 item
Array.prototype.splice.call(obj, 2, 1)

console.log(obj);

Answer 3

Answer №2

Deleting the second array from the object above results in only that key being removed, without affecting other keys. Object keys serve as identifiers to access the corresponding values' locations.

If you prefer all other keys to reset according to order, consider using arrays of arrays instead of objects with arrays as values.

An array consists of ordered items with numeral indices, while an object contains unordered items with any valid string or number indices.

In cases where using an object is necessary, here's a manual solution:

To remove the index i, adjust the subsequent indices (numerically greater than i) by decrementing their key value by 1.

// Indexing starts from 1 up to n.
const deleteElement = (delete_index, obj) => {
    const keyCount = Object.keys(obj).length;

    // Shift elements with keys > delete_index to previous index
    for(let i=delete_index; i<=keyCount; i++) {
        obj[i] = obj[i+1];
    }
    // Remove the last element
    delete obj[keyCount];
}

Answer 4

Deleting the second array from the object above results in only that key being removed, without affecting other keys. Object keys serve as identifiers to access the corresponding values' locations.

If you prefer all other keys to reset according to order, consider using arrays of arrays instead of objects with arrays as values.

An array consists of ordered items with numeral indices, while an object contains unordered items with any valid string or number indices.

In cases where using an object is necessary, here's a manual solution:

To remove the index i, adjust the subsequent indices (numerically greater than i) by decrementing their key value by 1.

// Indexing starts from 1 up to n.
const deleteElement = (delete_index, obj) => {
    const keyCount = Object.keys(obj).length;

    // Shift elements with keys > delete_index to previous index
    for(let i=delete_index; i<=keyCount; i++) {
        obj[i] = obj[i+1];
    }
    // Remove the last element
    delete obj[keyCount];
}

Answer 5

Answer №3

To remove elements from an array, you can utilize the splice method by specifying the index and number of items to remove. For example: arr.splice(2, 1)

Answer 6

To remove elements from an array, you can utilize the splice method by specifying the index and number of items to remove. For example: arr.splice(2, 1)

Working with arrays in JavaScript objects

Answer №1

Answer №2

Answer №3

Similar questions

How can I apply a class to the pre and code elements in Redactor?

Tips for reversing the order of elements in a 2D Array

Filter out specific fields from an object when populating in MongoDB using the aggregate method

Unable to retrieve hours from MongoDB date array

IndexOutOfRangeException : 6

What are some ways to reinvigorate your determination?

What is the best way to find a specific string within an array in a MongoDB document and extract that array value during a search operation?

Replicate the functionality of a LinkedList using a basic float array

Integrate data from Firebase into a React-Table component

Can jQuery effortlessly glide downward, come to a stop, continue downward, and then move upwards?

The results generated by the Google Maps API are consistently consistent

Show only the objects in a MongoDB collection that have a matching status in another collection

What is the best way to isolate particular components of an argument and store them in separate variables?

Manipulating the "placeholder" attribute with Knockout.js and JSON data

Two-way binding with Angular2's NgModel can encounter issues

Loop through an array of objects that each contain two sub-objects using ng

A single Modal, Ajax, and data that is continuously refreshed

No change in the element's text content when clicking

How can I efficiently load AJAX JSON data into HTML elements using jQuery with minimal code?

Show a notification when the values of variables 'enter' are not the