Обновите только один ключ в объекте JavaScript с картой - PullRequest
Новая
       42

Обновите только один ключ в объекте JavaScript с картой

0 голосов
/ 30 января 2019

Я хочу обновить мой thumbnail ключ в моем объекте. 

products :[
 {
    id: 1,
    name: "sth,
    thumb : 'abc.jpg'
 }
];

Я хочу обновить products.thumb всех objects в этом массиве, например thumb: 'server/abc.jpg

searchedProducts = products.map(product => {
    return Object.assign({},
    product, 
    product.thumb = product.thumb ? 'server'+product.thumb : '')
});

Токовый выход 

[{
    0: 's,
    1: 'e',
    3: 'r',
    4: 'v',
    5: 'e',
    id: 1,
    thumb :'server/abc.jpg'
}]

Ответы [ 6 ]

0 голосов
/ 30 января 2019

Вы также можете сделать это, используя reduce, инициализируя начало с пустым массивом, 

const result = products.reduce((prev, next) => {
  next.thumb = `server/${next.thumb}`;
  prev.push(next);
  return prev;
}, []);

console.log(result);

Просто еще один способ сделать это, кроме map.

0 голосов
/ 30 января 2019

С синтаксисом распространения: 

const products = [
  {
    id: 1,
    name: 'sth',
    thumb : 'abc.jpg'
  }
];

searchedProducts = products.map(product => {
  const thumb = product.thumb ? 'server/' + product.thumb : '';
  return { ...product, thumb };
});

console.log(searchedProducts);
0 голосов
/ 30 января 2019

Вы можете деструктурировать и получить свойство thumb и оставить остальные свойства в rest.Таким образом, вы можете сохранить оставшиеся свойства такими, какие они есть: 

const products = [{
    id: 1,
    name: "sth",
    thumb: 'abc.jpg'
  },
  {
    id: 2,
    name: "sth2",
    thumb: 'def.jpg'
  }
];

const newProducts = products
                      .map(({thumb, ...rest}) => ({ thumb: thumb ? `server/${thumb}` : ``, ...rest }));
    
console.log(newProducts)
0 голосов
/ 30 января 2019

Почему бы это не сработало для вас? 

const products = [
 {
    id: 1,
    name: 'sth',
    thumb : 'abc.jpg'
 },
 {
    id: 2,
    name: 'sth',
    thumb : 'def.jpg'
 }

];

// Non mutating

let copy = JSON.parse(JSON.stringify(products));
copy.forEach(product => {
    product.thumb = product.thumb ? 'copyserver/'+product.thumb : '';
});
console.log(copy);

// Mutating

products.forEach(product => {
    product.thumb = product.thumb ? 'server/'+product.thumb : '';
});
console.log(products);
0 голосов
/ 30 января 2019

Вы можете использовать разрушающее назначение с .map, чтобы изменить все thumb свойства.

См. Рабочий пример ниже: 

const products = [{id:1,name:"sth",thumb:"abc.jpg"},{id:2,name:"byt",thumb:"def.jpg"},{id:3,name:"mth"}],

res = products.map(({thumb, ...others}) => ({...others, "thumb": thumb ? "server/" + thumb:''}));
console.log(res);
0 голосов
/ 30 января 2019

Вы, вероятно, хотели использовать Object.assign примерно так: 

const products = [
  {
    id: 1,
    name: 'sth',
    thumb : 'abc.jpg'
  }
]

const searchedProducts = products.map(product => {
  return Object.assign({}, product, {
    thumb: product.thumb ? 'server/' + product.thumb : ''
  })
})

console.log(searchedProducts)

В приведенном выше фрагменте я объединяю:

  • Пустой объект.
  • С текущим итерированным productobject.
  • С другим объектом, содержащим вычисленный ключ thumb.
...