[javascript] JavaScript 또는 jQuery를 사용하여 배열 내에있는 객체의 값을 변경하는 방법은 무엇입니까?

아래 코드는 jQuery UI 자동 완성에서 비롯된 것입니다.

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"
    }
];

예를 들어 jquery-ui 의 desc 값 을 변경하고 싶습니다 . 어떻게해야합니까?

또한 데이터를 더 빨리 얻는 방법이 있습니까? 배열 내부의 객체와 마찬가지로 데이터에 데이터를 가져올 이름을 객체에 부여합니까? 그래서 그것은 같은 것입니다jquery-ui.jquery-ui.desc = ....

답변

배열에서 다음과 같이 검색해야합니다.

function changeDesc( value, desc ) {
   for (var i in projects) {
     if (projects[i].value == value) {
        projects[i].desc = desc;
        break; //Stop this loop, we found it!
     }
   }
}

그리고 그것을 사용하십시오

var projects = [ ... ];
changeDesc ( 'jquery-ui', 'new description' );

최신 정보:

더 빨리 얻으려면 :

var projects = {
   jqueryUi : {
      value:  'lol1',
      desc:   'lol2'
   }
};

projects.jqueryUi.desc = 'new string';

Frédéric의 의견에 따르면 객체 키에 하이픈을 사용하거나 “jquery-ui”및 projects [ “jquery-ui”] 표기법을 사용해야합니다.

답변

아주 간단합니다

findIndex방법을 사용하여 객체의 색인을 찾으십시오 .
인덱스를 변수에 저장하십시오.
다음과 같이 간단한 업데이트를 수행하십시오. yourArray[indexThatyouFind]

//Initailize array of objects.
let myArray = [
  {id: 0, name: "Jhon"},
  {id: 1, name: "Sara"},
  {id: 2, name: "Domnic"},
  {id: 3, name: "Bravo"}
],

//Find index of specific object using findIndex method.    
objIndex = myArray.findIndex((obj => obj.id == 1));

//Log object to Console.
console.log("Before update: ", myArray[objIndex])

//Update object's name property.
myArray[objIndex].name = "Laila"

//Log object to console again.
console.log("After update: ", myArray[objIndex])

스 니펫 확장

답변

원본 데이터 를 변경 하지 않고 ES6 방식 .

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"
}];

//find the index of object from array that you want to update
const objIndex = projects.findIndex(obj => obj.value === 'jquery-ui');

// make new object of updated object.   
const updatedObj = { ...projects[objIndex], desc: 'updated desc value'};

// make final new array of objects by combining updated object.
const updatedProjects = [
  ...projects.slice(0, objIndex),
  updatedObj,
  ...projects.slice(objIndex + 1),
];

console.log("original data=", projects);
console.log("updated data=", updatedProjects);

답변

ES6 덕분에 최고의 솔루션.

“jquery-ui”와 같은 값을 포함하는 객체에 대한 설명이 교체 된 새 배열을 반환합니다.

const newProjects = projects.map(p =>
  p.value === 'jquery-ui'
    ? { ...p, desc: 'new description' }
    : p
);

답변

당신이 사용할 수있는 $ .each ()를 배열을 반복하고 관심있는 개체를 찾습니다 :

$.each(projects, function() {
    if (this.value == "jquery-ui") {
        this.desc = "Your new description";
    }
});

답변

추가 라이브러리를 사용하지 않고 맵을 사용하는 것이 가장 좋은 솔루션입니다 (ES6 사용).

const state = [
{
    userId: 1,
    id: 100,
    title: "delectus aut autem",
    completed: false
},
{
    userId: 1,
    id: 101,
    title: "quis ut nam facilis et officia qui",
    completed: false
},
{
    userId: 1,
    id: 102,
    title: "fugiat veniam minus",
    completed: false
},
{
    userId: 1,
    id: 103,
    title: "et porro tempora",
    completed: true
}]

const newState = state.map(obj =>
    obj.id === "101" ? { ...obj, completed: true } : obj
);

답변

밑줄 / lodash 라이브러리를 사용하면 쉽게 수행 할 수 있습니다.

  _.chain(projects)
   .find({value:"jquery-ui"})
   .merge({desc: "new desc"});

문서 :
https://lodash.com/docs#find
https://lodash.com/docs#merge