[Solved] how to replace the value by comparing two json and to update in the created table

by


First, you will have to write a function that will iterate the subjectDetails array and find the subject name based on a label.

let subjectDetails = [{
  "subjectLabels": {
    "eng": "english",
    "sci": "environment science",
    "soc": "History & Geo"
  }
}]

const getSubjectName = (label) => {
  let name = label;
  
  subjectDetails.forEach(details => {
     if(details.subjectLabels.hasOwnProperty(label)){
       name = details.subjectLabels[label]
     }
  })

  return name
}

console.log(getSubjectName("eng"))
//OUTPUT: english

The getSubjectName will return the name of the subject if exists otherwise the default label.

The second part is already answered on the referenced answer. All you have to do is to update the label in place.

let classes = [{
  "Class": "A",
  "as_of": "12/31/2020",
  "student": [{
      "raji": {
        "eng": "35",
        "soc": "40",
        "sci": "39"
      }
    },
    {
      "akg": {
        "eng": "17",
        "soc": "40",
        "sci": "24"
      }
    }
  ]
}]


let subjectDetails = [{
  "subjectLabels": {
    "eng": "english",
    "sci": "environment science",
    "soc": "History & Geo"
  }
}]

const getSubjectName = (label) => {
  let name = label;
  
  subjectDetails.forEach(details => {
     if(details.subjectLabels.hasOwnProperty(label)){
       name = details.subjectLabels[label]
     }
  })

  return name
}

classes.forEach((item) => {

  let students = item.student;
  let marks = {}

  students.forEach((student) => {
    let student_names = Object.keys(student);

    student_names.forEach((name) => {

      if (marks[name] == undefined) {
        marks[name] = {}
      }

      let results = student[name];
      let subjects = Object.keys(results)

      subjects.forEach((subject) => {
        marks[name][subject] = results[subject]
      })

    })
  });


  let all_students = Object.keys(marks);
  let all_subjects = [...new Set(all_students.map(std => Object.keys(marks[std])).flat())]


  let theads = all_students.map((studnet) => {
    return `<th>${studnet}</th>`;
  })

  let tableHeader = `<thead><tr><th>Sub</th>${theads.join("")}</tr></thead>`;

  let tbodies = []

  all_subjects.forEach((subject) => {
    let sub_label = getSubjectName(subject)
    let mark_td = all_students.map(student => `<td>${marks[student][subject]}</td>`)
    tbodies.push(`<tr><td>${sub_label}</td>${mark_td.join("")}</tr>`)
  })

  let tableBody = `<tbody>${tbodies.join("")}</tbody>`


  let table = `<table>${tableHeader}${tableBody}</table>`;


  document.getElementById("app").innerHTML += table

})
table {
  border-collapse: collapse;
}

td, th{
  border:1px solid #ddd;
  padding: 4px 18px;
}
<div id="app"></div>

1

solved how to replace the value by comparing two json and to update in the created table