"Using Typescript, we can switch the keys and values in a JSON object to their corresponding values and

Question

"Using Typescript, we can switch the keys and values in a JSON object to their corresponding values and

I have been attempting to switch keys with values and vice versa, but I haven't been able to find the correct solution using JavaScript/TypeScript.

  course =  
  [ 
   { 
     "name" : "John",
     "course" : ["Java", "Python"]
   },
   { 
     "name" : "Michel",
     "course" : ["Java", "Python", "Ruby"]
   }
   ]

The desired JSON output should be:

  result = [
   {
     "course" : "Java",
     "name" : ["John", "Michel"]

   }, 
   {
     "course" : "Python",
     "name" : ["John", "Michel"]
   },
   {
     "course" : "Ruby",
     "name" : ["Michel"]
   }

   ]

javascript json typescript

Answer 1

Answer №1

Check out this JavaScript solution below. By utilizing the reduce method, I've structured the data into an intermediate object:

{
  HTML: {
    tech: "HTML",
    devs: ["Alice", "Bob"]
  },
  CSS: {
    tech: "CSS",
    devs: ["Alice", "Bob"]
  },
  JavaScript: {
    tech: "JavaScript",
    devs: ["Bob"]
  }
}

Then, I'm using Object.values on this intermediate object to extract the values array as requested.

const developers = [    
  {      
    "name": "Alice",     
    "techs" : ["HTML", "CSS"]   
  },   
  {      
    "name" : "Bob",
    "techs" : ["HTML", "CSS", "JavaScript"]
  }   
]

const output = Object.values(developers.reduce((acc,{name, techs}) => {
  techs.forEach(t => {
    acc[t]??={tech:t,devs:[]}
    acc[t].devs.push(name)
  })
  return acc
},{}))

console.log(output)

Answer 2

Check out this JavaScript solution below. By utilizing the reduce method, I've structured the data into an intermediate object:

{
  HTML: {
    tech: "HTML",
    devs: ["Alice", "Bob"]
  },
  CSS: {
    tech: "CSS",
    devs: ["Alice", "Bob"]
  },
  JavaScript: {
    tech: "JavaScript",
    devs: ["Bob"]
  }
}

Then, I'm using Object.values on this intermediate object to extract the values array as requested.

const developers = [    
  {      
    "name": "Alice",     
    "techs" : ["HTML", "CSS"]   
  },   
  {      
    "name" : "Bob",
    "techs" : ["HTML", "CSS", "JavaScript"]
  }   
]

const output = Object.values(developers.reduce((acc,{name, techs}) => {
  techs.forEach(t => {
    acc[t]??={tech:t,devs:[]}
    acc[t].devs.push(name)
  })
  return acc
},{}))

console.log(output)

Answer 3

Answer №2

const students = [{
    name: 'Emma',
    subjects: ['Math', 'Science'],
  },
  {
    name: 'Lucas',
    subjects: ['English', 'History', 'Geography'],
  },
]

const temp = students.reduce((acc, value) => {
  value.subjects.forEach(subject => {
    if (!acc[subject]) {
      acc[subject] = []
    }

    acc[subject].push(value.name)
  })

  return acc
}, {})

const result = Object.entries(temp).reduce((acc, [subject, name]) => {
  acc.push({
    subject,
    name,
  })

  return acc
}, [])

console.log(result)

Answer 4

const students = [{
    name: 'Emma',
    subjects: ['Math', 'Science'],
  },
  {
    name: 'Lucas',
    subjects: ['English', 'History', 'Geography'],
  },
]

const temp = students.reduce((acc, value) => {
  value.subjects.forEach(subject => {
    if (!acc[subject]) {
      acc[subject] = []
    }

    acc[subject].push(value.name)
  })

  return acc
}, {})

const result = Object.entries(temp).reduce((acc, [subject, name]) => {
  acc.push({
    subject,
    name,
  })

  return acc
}, [])

console.log(result)

"Using Typescript, we can switch the keys and values in a JSON object to their corresponding values and

Answer №1

Answer №2

Similar questions

iOS app launch does not trigger Phonegap handleOpenURL

Dynamically adjust row height in AG Grid within an Angular application based on the visibility of other columns

Is it possible to iterate over a non-reactive array in a Vue template without having to store it in a data property or computed property?

Implementing a feature in ReactJS that enables users to select a minimum and maximum limit for checkboxes

What are the steps to start up a NodeJS API using an Angular app.js file?

Converting Json data without key names into C#

What could be causing the Javascript Dynamic HTML5 Table to not display on the page?

Using Angular 2's dependency injection to inject several instances at once

Troubleshoot JavaScript in a Firefox browser extension

Node.js retrieves a single row from a JSON array with two dimensions

Modifying the background image of the <body> element in CSS to reflect the season based on the current month in the calendar

Creating a OneToMany relationship in NestJS entity model

Error: The expression `xmlDoc.load` returns a value of undefined, which is not an object

Data is not being displayed in the Angular table

Instead of providing a list of Django models, opt to return a JSON response instead

Design a function that accepts a string parameter and outputs an encoded (h4ck3r 5p34k) rendition of the input string

Unable to run unit tests on project using my custom React library

What is the best way to access the "Path" file stored in a JSON file using Python?

Accessing Element Content Without Identifiers in JavaScript

Is there a way to specify this component without it being nested within the parent element?