Как изменить значение в массиве объектов?

Question

У меня есть массив объектов, как пробежаться по нему с помощью метода map чтобы изменить допустим поле text в id=1

posts = [
{
    "id": 1,
        "text": "One",
        "likes": "1" 
},
{
    "id": 2,
        "text": "Two",
        "likes": 50 
},
{
    "id": 3,
        "text": "Three",
        "likes": 7 
}

]

Я пробовал делать так:

const newPosts = posts.map((post)=>post.id===1?post.text='other text':post.text=post.text);

Но мне не возвращается массив объектов целиком а только текст который я добавил "other text". Как сделать чтобы вернулся весь массив с измененным текстом?

Answer 1

const newPosts = posts.map((post) => (
  post.id === 1
    ? { ...post, text: 'other text' }
    : post
));

Метод map создает новый массив и для этого тебе надо вернуть либо старый post, либо обновленный.

Answer 2

Map создает новый массив и будет дорого стоить на больших объектах. Так как помимо переобхода массива, вы получите переобход ключей при деструктуризации. Весь вопрос в том, нужен ли вам исходный массив в первоначальном состоянии.

Возможно вам проще будет использовать forEach если вхождений больше одного или через find найти нужное и поменять:

posts = [
{
    "id": 1,
        "text": "One",
        "likes": "1" 
},
{
    "id": 2,
        "text": "Two",
        "likes": 50 
},
{
    "id": 3,
        "text": "Three",
        "likes": 7 
}]

posts.forEach((post)=>post.id===1?post.text='other text':post.text=post.text)

console.log(posts)

const post = posts.find((post) => post.id===1)
post.text = 'other text 2'

console.log(posts)

Answer 3

const posts = [{
    "id": 1,
    "text": "One",
    "likes": "1"
  },
  {
    "id": 2,
    "text": "Two",
    "likes": 50
  },
  {
    "id": 3,
    "text": "Three",
    "likes": 7
  }
]

const newPosts = posts.map((post) => ({
  ...post,
  text: post.id === 1 ? 'other text' : post.text
}));

console.log(newPosts);

БЛОГ НА HUSL

Как изменить значение в массиве объектов?

Ответы (3 шт):