JSON payload with an array that includes nested JSON objects

I am struggling with JSON objects and need to create a JSN structure similar to the following:

{
 name: 'root',
 children: [
     name: 'son1',
     children: [....]
 ]
}

Could someone please guide me on how to construct it using Javascript? Your help is greatly appreciated.

Answer №1

Perhaps you're referring to constructing by utilizing objects? Then, you can simply invoke JSON.stringify()

function CustomObject(title) {
  this.title = title,
  this.children = [],
  this.addChild = (child) => {
    this.children.push(child);
  }
}

const mainObj = new CustomObject("main");

for(let num=0; num<10; num++) {
  let childObj = new CustomObject(`child ${num}`);
  mainObj.addChild(childObj);
}

document.querySelector('pre').innerHTML = JSON.stringify(mainObj);
<pre>

</pre>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Retrieving information from subscription

I am currently diving into Angular 2 and have successfully fetched data from my service. However, before displaying it on the view, I need to iterate over it using a for() loop. To achieve this, I have stored the fetched JSON data into an array. But I&apos ...

How to Retrieve Grandparent Component Attributes in Angular Using Grandchild Components

I am constructing an Angular application and facing the challenge of accessing a property of Component 1 within Component 3. In this scenario, the relationship is described as grandparent-grandchild. Successfully establishing communication between parent/ ...

Capturing the dynamic server response with nested JSON structures

I am in the process of creating a dynamic data-binding function named assemble that requires two input parameters: server response (JSON) - nested JSON object. instruction set (JSON) - a configuration object that dictates the binding. The Issue: The cur ...

PHP - Unable to verify session during script execution

I'm currently working on a PHP script with a lengthy execution time, and I am looking for a way to update the client on the progress of the script. Since the script is invoked via AJAX, output buffering is not a feasible option (and I prefer to keep ...

Angular 7: Resetting multiple dynamically generated checkboxes back to their original state with the click of a button

I have created a child component that contains 3 checkboxes, generated dynamically using ngFor, along with Apply and Cancel buttons. In the parent template, I include the selector tag for the child component. The parent component accesses this child compo ...

CodeIgniter controller returning data

Currently, I am utilizing CodeIgniter for a particular project that I am deeply involved in. Within one of my views, there exists an ajax call structured as follows: $.ajax({ type: 'GET', url: 'extra/search/infojson/' + $(this ...

Allowing input fields to accept decimal numbers

I am currently facing an issue with an input field that is set to type=number, which does not allow for decimal numbers. However, I need to enable users to input decimal numbers but haven't been able to make it work. Would using regex be a possible so ...

Using C# to deserialize JSON with Inheritance

Here is some code that creates an object, writes it to a file, reads from the file, and deserializes it back into the same object. The issue here is that when deserializing, the information in one of the properties is lost. internal class Program { pr ...

Encountering a react error following the installation of FontAwesome via npm

I successfully installed fontawesome by visiting their official website and following the steps below: 1. npm i --save @fortawesome/fontawesome-svg-core 2. npm install --save @fortawesome/free-solid-svg-icons 3. npm install --save @fortawesome/react-fon ...

What is the best way to address Peer dependency alerts within npm?

Here is a sample package.json that I am using for my application: dependencies : { P1 : “^1.0.0” // with peer dependency of p3 v1 P2 : “^1.0.0” // with peer dependency of p3 v2 } P1 and P2 both have peer dependencies on ...

Creating a single factory that consolidates multiple return statements

Exploring the ins and outs of AngularJS, I find myself eager to learn how to effectively combine two factory modules. Specifically, I am interested in merging the following two: // Factory Module One services.factory('UserService', function ($re ...

AngularJS: ng-repeat excluding duplicate keys

Here is a collection of objects I am working with: [{ key:test1 name: name1 }, { key:test1 name: name2 }, { key:test2 name: name3 }] I am currently using ng-repeat to showcase them: <tr ng-repeat=item in list> <td>{{item.key}}</td ...

How can I update information based on the chosen option in a select dropdown using Vue?

I have a chart displayed in my user interface that needs to be updated based on the selected time period. By default, the chart displays data from the past year, but when the user selects "Month," it should show data from the past month. <div cla ...

"Return to previous view with the zoom back feature in CanvasJS

How can I implement a zoom back button in CanvasJS using jQuery or normal JavaScript? I've been attempting to place it near the ones in the top right corner, but something seems to be amiss. Alternatively, is it feasible to enable zooming in and out ...

The function 'toBlob' on 'HTMLCanvasElement' cannot be executed in react-image-crop because tainted canvases are not allowed to be exported

Currently, I am utilizing the react-image-crop npm package for image cropping purposes. Everything works perfectly when I pass a local image as props to the module. However, an issue arises when I try to pass a URL of an image fetched from the backend - th ...

Next.js endeavors to interpret MDX files as basic JavaScript code

Currently, I'm in the process of creating a website using Next.js and incorporating (local) MDX files for my content. However, I've encountered an issue where whenever I add a .MDX file to my source tree and attempt to navigate to it, Next.js thr ...

Is it possible for third party packages to function properly without the node_modules directory?

Whenever we push our code to GitHub or any other remote repository service, we make sure to exclude the node_modules folder. This begs the question: how are all the third-party libraries functioning on the hosted website if the node_modules folder is not ...

Prevent automatic merging of JSON data with identical IDs

My AJAX call to a PHP select request is as follows: $.ajax({ type: "POST", url: "/renforts/_getIntervenantManager", data: { IDMission : IDMission, IDManager : IDManager }, dataType : 'json' ...

Syntax error occurs while attempting to render the return statement in a React Component

Just starting out with React and encountering a syntax issue that has me stumped. I'm working on a React Component and I thought I had the opening/closing { & }'s correct, but clearly there's something missing based on the error message it&a ...

Can I create interactive stacked shapes with CSS and/or JavaScript?

Trying to explain this may be a challenge, so please bear with me. I need to create an "upvote" feature for a website. The number of upvotes is adjustable in the system settings. The upvote controls should resemble green chevrons pointing upwards. For exa ...