JavaScript console.log are same with `map` method in array

Asked Apr 04 '19 at 10:05

Active Apr 04 '19 at 10:10

Viewed 3,381 times

const get = function() {
  return {
    name: 'me'
  }
}
const array = Array(10).fill(get());
console.log(array);

array.map(item => {
  console.log('1', item);
  item.a = '555'
  console.log('2', item);
  return item;
})

As you see, I modify element in the array like this item.a = '555'. I might console.log will output like this:

1 { name: 'me' } 
2 { name: 'me', a: '555' }

but, actually I got this:

1 { name: 'me', a: '555' } 
2 { name: 'me', a: '555' }

How to understand this?

edited Apr 04 '19 at 10:10

asked Apr 04 '19 at 10:05

Todd Mark

1,847
13
25

`get()` is only being called once; you only have a single object in memory, which you're mutating on every iteration. Use `Array.from` instead – CertainPerformance Apr 04 '19 at 10:07
@CertainPerformance Actually, My question is why console's output is same. not how to fill Array. – Todd Mark Apr 04 '19 at 10:08
`console.log` is asynchronous, it's kinda weird - the objects you examine are checked *when examined*, not when logged (see new link) – CertainPerformance Apr 04 '19 at 10:09
because each item of array is ref to name object – taile Apr 04 '19 at 10:11
you can do the test like this `array[0] === array[1]` it's gonna produce `true` – taile Apr 04 '19 at 10:11

JavaScript console.log are same with `map` method in array

0 Answers0