Based on type change object to nested array in javascript

Question

How to change nested object to array object by type in javascript.

Based on object key value type if its array/string change the object to array as shown below in javascript

var ob1 = {
  "list": [
    "service",
    "finance",
    "s1.jpg"
  ],
  "info": [
    "details",
    "mail",
    "s2.jpg"
  ]
}

var ob2 = {
   key1: "v1",
   key2: "v2"
}
var result1=this.modifyObject(ob1);
var result2=this.modifyObject(ob2);

function modifyObject(ob){
  const { field, value, id, ...fields } = ob;
  const rest = Object.entries(fields)
  .map(([field, value], id) => ({ field, value, id }));
  const result = [...rest];
  return result;
}

Expected Output,

// object type value is array
[
 {field: "list", value: ["service","finance"], image: "s1.jpg", id:0},
 {field: "info", value: ["details","mail"], image: "s2.jpg", id:1}
]


// object type value is string
[
 {field:"key1", value:"v1", id:0 },
 {field:"key2", value:"v2", id:1 }
]

Does the image always at the last index? and more than that, how are you getting the name of the property for the image string? in this case image, and id for the second object. — Ele
– Ele, Commented Sep 1, 2020 at 15:25
@Ele, thanks for reply, yes image is the last index and updated the expected output — ved
– ved, Commented Sep 1, 2020 at 15:32

Nick Parsons · Accepted Answer · 2020-09-01 15:48:42Z

You can grab the entires of your input object using Object.entries() and map each [key, value] pair to a new object. You can determine what type of object you want to return by checking whether the second value in the [key, value] pair array is an array (ie: checking if the value is an array) by using Array.isArray(). If it is an array, you can set the value to be the array, and the image to be the last element (obtained by using .pop(), if you don't want to modify the original object you can use slice instead). Otherwise, if the element is not an array, you can return an object which has an id property. The id property is based on the index of the object from the mapping function.

See example below:

const ob1 = { "list": [ "service", "finance", "s1.jpg" ], "info": [ "details", "mail", "s2.jpg" ] }; const ob2 = { key1: "v1", key2: "v2" };

const modifyObject = obj =>
  Object.entries(obj).map(([field, value], id) => 
    Array.isArray(value) ? {field, value, image: value.pop()}
    : {field, value, id}
  );

const result1 = modifyObject(ob1);
const result2 = modifyObject(ob2);

console.log(result1);
console.log(result2);

Note that this id property is based on the ordering of how Object.entries() obtains the key-value pairs from your object, so it may differ in older browsers (the newest JS spec specifies the ordering of how the [key, value] pairs are obtained using Object.entries, but older browsers may not follow this)

Ele · Accepted Answer · 2020-09-01 15:47:30Z

0

You can use the function Array.prototype.entries along with the function Array.prototype.reduce to build the desired output.

let ob1 = {  "list": [    "service",    "finance",    "s1.jpg"  ],  "info": [    "details",    "mail",    "s2.jpg"  ]},
    ob2 = {       key1: "v1",       key2: "v2"};

function modifyObject(obj) {
  return Object.entries(obj).reduce((r, [field, value], id) => {
    let [image] = Array.isArray(value) ? value.slice(-1) : [];
    let v = Array.isArray(value) ? value.slice(0, value.length - 1) : value;
    
    return r.concat(Object.assign({id, [field]: v}, image ? {image} : {}));
  }, []);
}

console.log(modifyObject(ob1));
console.log(modifyObject(ob2));

edited Sep 1, 2020 at 15:47

answered Sep 1, 2020 at 15:41

Ele

33.8k7 gold badges43 silver badges80 bronze badges

Collectives™ on Stack Overflow

Based on type change object to nested array in javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related