Generate a JSON line for each value in the ARRAY

Question

Generate a JSON line for each value in the ARRAY

Hello everyone, I'm currently working on implementing handlebars templating and to do so I need to generate a JSON from array values

{"path":"Avions", "fileName":"AvionsEdit.vue"},{"path":"Avions", 
"fileName":"AvionsShow.vue"}etc...

While I can create a JSON like the one shown in the code snippet above, I would prefer the format below:

{"path":["Avions","Avions"],"fileName": 
["AvionsEdit.vue","AvionsShow.vue"]}

var foo = {"path" : [], "fileName": []};
for(i = 0; i < list.length; i++) {
   foo.path.push(list[i]);
   foo.fileName.push(list[i]+extList[i]+".vue");
}
console.log(JSON.stringify(foo));

Here is the list I'm working with:

['Avions',
'Avions']

And here is the extList corresponding to each item in the list:

['Edit',
'Show']

javascript json

Answer 1

Answer №1

Feeling a bit old-fashioned with my reliance on nested for loops, but I couldn't come up with a better solution (although it's quite reliant on data consistency, it's still pretty simple and easy to read):

var srcData = {
  "path": [
    "somepath",
    "anotherpath",
    "yetanotherpath"
  ],
  "filename": [
    "somefilename",
    "anotherfile",
    "yetanotherfile"
  ]
};

const transform = src => {
   let res = [];
   let attributes = Object.keys(src);
   for(let i = 0; i < Object.values(src)[0].length; i++){
      let entry = {};
      for(let j = 0; j < attributes.length; j++){
          entry[attributes[j]] = Object.values(src)[j][i];
      }
      res.push(entry);
   }
   return res;
};

console.log(transform(srcData));

Answer 2

Feeling a bit old-fashioned with my reliance on nested for loops, but I couldn't come up with a better solution (although it's quite reliant on data consistency, it's still pretty simple and easy to read):

var srcData = {
  "path": [
    "somepath",
    "anotherpath",
    "yetanotherpath"
  ],
  "filename": [
    "somefilename",
    "anotherfile",
    "yetanotherfile"
  ]
};

const transform = src => {
   let res = [];
   let attributes = Object.keys(src);
   for(let i = 0; i < Object.values(src)[0].length; i++){
      let entry = {};
      for(let j = 0; j < attributes.length; j++){
          entry[attributes[j]] = Object.values(src)[j][i];
      }
      res.push(entry);
   }
   return res;
};

console.log(transform(srcData));

Answer 3

Answer №2

I missed out on viewing your latest comments as I was anticipating notifications that never arrived. I've developed a function that can produce the desired output. The various arguments required are:

Path : List of paths or prefixes
File : File name
suffix : Suffix/extension of the file

var path = [ // list of paths or prefixes
      "path",
      "otherPath",
      "finalPath"
    ];
    var files = [ // file names

      "Edit",
      "Get",
      "Foo"

    ];
console.log(transform(path, files, ".vue")); 


 function transform(path, files, suffix) { // receives paths, file names, and file suffix
      if (path.length == files.length) { // checks if the lengths are equal
        let results = { "path": [], "filename": [] }; // initializes object for return
        for (let i = 0; i < path.length; i++) {
          results.path.push(path[i]); // adds path to path array 
          results.filename.push(path[i] + files[i] + suffix) // generates file name by concatenating Path + File + suffix

        }
        return results;
      }
    }

Answer 4

I missed out on viewing your latest comments as I was anticipating notifications that never arrived. I've developed a function that can produce the desired output. The various arguments required are:

Path : List of paths or prefixes
File : File name
suffix : Suffix/extension of the file

var path = [ // list of paths or prefixes
      "path",
      "otherPath",
      "finalPath"
    ];
    var files = [ // file names

      "Edit",
      "Get",
      "Foo"

    ];
console.log(transform(path, files, ".vue")); 


 function transform(path, files, suffix) { // receives paths, file names, and file suffix
      if (path.length == files.length) { // checks if the lengths are equal
        let results = { "path": [], "filename": [] }; // initializes object for return
        for (let i = 0; i < path.length; i++) {
          results.path.push(path[i]); // adds path to path array 
          results.filename.push(path[i] + files[i] + suffix) // generates file name by concatenating Path + File + suffix

        }
        return results;
      }
    }

Generate a JSON line for each value in the ARRAY

Answer №1

Answer №2

Similar questions

Disposing of memory in THREE JS when switching between routes in VUE

Why is this tetris piece not appearing fully on the grid when using arrays?

Vue.js: Issue with applying class binding while iterating over an object

Deciphering the intricacies of VUEX-STORE modules

To ensure at least one checkbox is selected, retrieve the values from the checkboxes and proceed to store them in a state variable for validation

JavaScript code for Tree not functioning correctly on Internet Explorer

Short-circuiting async flows on non-error events in Node.js

When modifying the state of an array within a component, certain values may be overwritten and lost in the process

Address Book on Rails

Adding a custom property to a React component

Find the name of the class using JavaScript

Employ an asynchronous immediately-invoked function expression within the callback

How to send JSON data without specifying keys in Java

Implementing basic authentication in Socket.IO on a Node.js server

Presenting JSON output using AngularJS

Using React for form validation

Node.js version 12.7 does not have the ability to support dynamic keys within objects

The Material UI Popover is appearing outside the designated boundaries

Tips on adjusting the pixel dimensions of an image using a file object

The PHP sorted array loses its order when encoded into JSON and then sorted in JavaScript