Ways to package object fields within an array

Question

Ways to package object fields within an array

I am in possession of an object with various properties, ranging from arrays to objects.

My goal is to transform the object so that each sub field is encapsulated within an array.

For instance:

"head": {
            "text": "Main title",
            "sub": {
                "value": "next"
            },
            "place": "secondary"
        }

The 'head' field contains an object. I aim to have the object enclosed in an array like this:

"head": [{
            "text": "Main title",
            "sub": {
                "value": "next"
            },
            "place": "secondary"
        }]

I have recognized that maintaining the structure consistent for every item is essential.

I attempted to achieve this using interfaces but encountered issues as the object type varies. As a result, I seek to retain the structure.

If there are better methods to convert the object into a suitable interface, I would appreciate hearing about them.

Thank you!

arrays json typescript

Answer 1

Answer №1

This function will iterate through each value recursively, converting it to an array if it is not one already, while excluding keys specified in the keysToSkip array.

const obj = {
  "head": {
    "text": "Main title",
    "sub": {
      "value": "next"
    },
    "place": "secondary"
  },
  "alreadyArray": [
    "val", "val2"
  ]
}

const keysToSkip = ["value"]

let depthFirstLoop = (obj) => {
  Object.keys(obj).forEach((key) => {
    if (typeof obj[key] === 'object' && obj[key] !== null) {
      depthFirstLoop(obj[key]);
    }
    if (!Array.isArray(obj[key]) && !keysToSkip.includes(key)) {
      obj[key] = [obj[key]]
    }
  });
};

depthFirstLoop(obj)

https://jsfiddle.net/9p7k64ec/26/

Answer 2

This function will iterate through each value recursively, converting it to an array if it is not one already, while excluding keys specified in the keysToSkip array.

const obj = {
  "head": {
    "text": "Main title",
    "sub": {
      "value": "next"
    },
    "place": "secondary"
  },
  "alreadyArray": [
    "val", "val2"
  ]
}

const keysToSkip = ["value"]

let depthFirstLoop = (obj) => {
  Object.keys(obj).forEach((key) => {
    if (typeof obj[key] === 'object' && obj[key] !== null) {
      depthFirstLoop(obj[key]);
    }
    if (!Array.isArray(obj[key]) && !keysToSkip.includes(key)) {
      obj[key] = [obj[key]]
    }
  });
};

depthFirstLoop(obj)

https://jsfiddle.net/9p7k64ec/26/

Answer 3

Answer №2

It is generally recommended not to modify an object while iterating through it. It is a better practice to create a new object instead.

const originalObj = {
  "header": {
    "text": "Main heading",
    "subheading": {
      "value": "next value"
    },
    "location": "secondary"
  }
}
var copiedObj = {}

for (property in originalObj){
    copiedObj[property] = [originalObj[property]]
}

Answer 4

It is generally recommended not to modify an object while iterating through it. It is a better practice to create a new object instead.

const originalObj = {
  "header": {
    "text": "Main heading",
    "subheading": {
      "value": "next value"
    },
    "location": "secondary"
  }
}
var copiedObj = {}

for (property in originalObj){
    copiedObj[property] = [originalObj[property]]
}

Ways to package object fields within an array

Answer №1

Answer №2

Similar questions

How can I retrieve the number of links pointing to a specific property within a JavaScript object

Tips for iterating through a JSON object's values with jQuery AJAX

What are some alternative ways to refactor my code in AsyncTask without using runOnUiThread?

The module has defined the component locally, however, it has not been made available for

Analyzing individuals within an array

CUDA/C++ implementation for searching in a table of positive integers

Combining cURL responses to create a unified json output: Guide

PHP code to filter out repeated numbers in an array and display the unique digits

Get notified with ng2-smart-table updates when editing

Merging Promises in Typescript

Can you pass a generic type as a parameter for another generic in Java?

How can I set up Prettier to exclude a line following a specific pattern?

There was an issue with parsing the JSON: Unable to convert an Array value to type ""

Obtain an array containing only unique values from a combination of arrays

I'm looking to receive the specific data types for express request arguments. How can I

Using subscribe method to return an observable within a function

Establishing a Next.js API endpoint at the root level

Issue with accessing data from database in my app

ionChange - only detect changes made in the view and update the model in Ionic 2

Remap Objects Function with Correct Return Data Type