How to change value of object which is inside an array using JavaScript or jQuery?

Question

The code below comes from jQuery UI Autocomplete:

var projects = [
    {
        value: "jquery",
        label: "jQuery",
        desc: "the write less, do more, JavaScript library",
        icon: "jquery_32x32.png"
    },
    {
        value: "jquery-ui",
        label: "jQuery UI",
        desc: "the official user interface library for jQuery",
        icon: "jqueryui_32x32.png"
    },
    {
        value: "sizzlejs",
        label: "Sizzle JS",
        desc: "a pure-JavaScript CSS selector engine",
        icon: "sizzlejs_32x32.png"
    }
];

For example, I want to change the desc value of jquery-ui. How can I do that?

Additionally, is there a faster way to get the data? I mean give the object a name to fetch its data, just like the object inside an array? So it would be something like jquery-ui.jquery-ui.desc = ....

You would have to transform the array into a Javascript object in order to use the syntax projects["jquery-ui"].desc. Would that be worth the effort only to get nicer syntax? — Frédéric Hamidi
– Frédéric Hamidi, Commented Jan 14, 2011 at 10:26
I've updated my solution with your latest question. And you can use the "projects.jquery-ui.desc" notation. — Aston
– Aston, Commented Jan 14, 2011 at 10:28
** ↑ aston means you can use that notation if the object structure is changed as per his answer below. (Not with the OP's existing example structure.) — ashleedawg
– ashleedawg, Commented Oct 27, 2020 at 22:04
For new people, just use .find() it's a method for the array and is very useful in this case. See abe kur's answer on this. — Tigerrrrr
– Tigerrrrr, Commented Mar 2, 2021 at 3:22

Muluken Getachew · Accepted Answer · 2023-04-21 12:45:46Z

-1

A short one liner

Also Safe

(projects.find(pr => pr.value === 'jquery-ui') || {}).desc = 'changed'

answered Apr 21, 2023 at 12:45

Muluken Getachew

1,04311 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Abdul Fasith · Accepted Answer · 2023-09-07 09:54:58Z

-1

//lets assume toupdateObjectId == 1

const updatedArray =  myArray.map(arr => {
  if (arr.id === toupdateObjectId) {
    return { ...arr, desc: newDesc };
  }
  return arr;
});
console.log(updatedArray)

edited Sep 7, 2023 at 9:54

answered Sep 7, 2023 at 9:54

Abdul Fasith

11 bronze badge

Comments

Bharata · Accepted Answer · 2018-08-22 15:02:04Z

This is my response to the problem. My underscore version was 1.7 hence I could not use .findIndex.

So I manually got the index of item and replaced it. Here is the code for the same.

 var students = [ 
{id:1,fName:"Ajay", lName:"Singh", age:20, sex:"M" },
{id:2,fName:"Raj", lName:"Sharma", age:21, sex:"M" },
{id:3,fName:"Amar", lName:"Verma", age:22, sex:"M" },
{id:4,fName:"Shiv", lName:"Singh", age:22, sex:"M" }
               ]

Below method will replace the student with id:4 with more attributes in the object

function updateStudent(id) {
 var indexOfRequiredStudent = -1;
    _.each(students,function(student,index) {                    
      if(student.id === id) {                        
           indexOfRequiredStudent = index; return;      
      }});
 students[indexOfRequiredStudent] = _.extend(students[indexOfRequiredStudent],{class:"First Year",branch:"CSE"});

}

With underscore 1.8 it will be simplified as we have methods _.findIndexOf.

Kishan Bharda · Accepted Answer · 2020-01-13 13:41:34Z

-2

Let you want to update value of array[2] = "data"

    for(i=0;i<array.length;i++){
      if(i == 2){
         array[i] = "data";
        }
    }

edited Jan 13, 2020 at 13:41

Kishan Bharda

5,7314 gold badges36 silver badges60 bronze badges

answered Jan 13, 2020 at 12:39

Vinod kumar

12 bronze badges

2 Comments

Tim Abdiukov Over a year ago

Is this an answer or a question?

BlueWater86 Over a year ago

You successfully updated the 2nd item in that array in the most complicated way possible.

Collectives™ on Stack Overflow

How to change value of object which is inside an array using JavaScript or jQuery?

34 Answers 34

Comments

Comments

Comments

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

34 Answers 34

Comments

Comments

Comments

2 Comments

Linked

Related