Update array of objects with JavaScript?

In JavaScript, you can update an array of objects by modifying existing objects or adding new ones. This is commonly done using methods like push(), splice(), or array methods like map() and find().

Let's say we have the following array of objects:

var studentDetails = [
   { firstName: "John", listOfSubject: ['MySQL', 'MongoDB']},
   {firstName: "David", listOfSubject: ['Java', 'C']}
];
console.log("Initial array:", studentDetails);

Initial array: [
  { firstName: 'John', listOfSubject: [ 'MySQL', 'MongoDB' ] },
  { firstName: 'David', listOfSubject: [ 'Java', 'C' ] }
]

Method 1: Adding New Objects with push()

The simplest way to add a new object to the array:

var studentDetails = [
   { firstName: "John", listOfSubject: ['MySQL', 'MongoDB']},
   {firstName: "David", listOfSubject: ['Java', 'C']}
];

var newStudent = {firstName: "Bob", listOfSubject: ['JavaScript']};
studentDetails.push(newStudent);

console.log(studentDetails);

[
  { firstName: 'John', listOfSubject: [ 'MySQL', 'MongoDB' ] },
  { firstName: 'David', listOfSubject: [ 'Java', 'C' ] },
  { firstName: 'Bob', listOfSubject: [ 'JavaScript' ] }
]

Method 2: Update Existing or Add New

This function checks if an object exists based on criteria, updates it if found, or adds it as new:

var studentDetails = [
   { firstName: "John", listOfSubject: ['MySQL', 'MongoDB']},
   {firstName: "David", listOfSubject: ['Java', 'C']}
];

function updateOrAddStudent(studentObjects, updateObj) {
    for(var index = 0; index 

Added new student
[
  { firstName: 'John', listOfSubject: [ 'MySQL', 'MongoDB' ] },
  { firstName: 'David', listOfSubject: [ 'Java', 'C' ] },
  { firstName: 'Bob', listOfSubject: [ 'JavaScript' ] }
]


Method 3: Using Modern Array Methods

Using findIndex() for cleaner code:

var studentDetails = [
   { firstName: "John", listOfSubject: ['MySQL', 'MongoDB']},
   {firstName: "David", listOfSubject: ['Java', 'C']}
];

function updateStudentModern(students, newStudent) {
    const index = students.findIndex(student => student.firstName === newStudent.firstName);
    
    if (index !== -1) {
        students[index] = newStudent;
        console.log("Student updated");
    } else {
        students.push(newStudent);
        console.log("New student added");
    }
}

var newStudent = {firstName: "Alice", listOfSubject: ['Python', 'React']};
updateStudentModern(studentDetails, newStudent);

console.log(studentDetails);


New student added
[
  { firstName: 'John', listOfSubject: [ 'MySQL', 'MongoDB' ] },
  { firstName: 'David', listOfSubject: [ 'Java', 'C' ] },
  { firstName: 'Alice', listOfSubject: [ 'Python', 'React' ] }
]


Comparison

Conclusion

Use push() to simply add new objects. For updating existing objects or adding new ones conditionally, combine findIndex() or loops with push() for flexible array management.