js里forEach赋值的问题

Question

 const a = [{ aa: 1, b: 2 }];
  console.log(a);
  const foo = function foo(value) {
    value.aa = 5;
  };
  a.forEach(foo);
  console.log(a);

结果

为什么在还没赋值之前 输出的变量就已经做了改变？

Answer 1

针对引用类型，console控制台点击三角的时候，输出的是最新的值

Answer 2

在控制台运行一下这个:

 const a = [{ aa: 1, b: 2 }];
  console.log(a);
  var foo = function (value) {
    value.aa = 5;
  };
  a.forEach(foo);
  console.log(a);
  a[0].aa = 10;
  console.log(a);

和

 const a = [{ aa: 1, b: 2 }];
  console.log(a[0]);
  var foo = function (value) {
    value.aa = 5;
  };
  a.forEach(foo);
  console.log(a[0]);
  a[0].aa = 10;
  console.log(a[0]);

你会发现，其实值是改变了的，我认为这种结果只是 chrome 的 console.log 在你更新数组后，点击数组的时候把值也给更新了罢了

Answer 3

反对采纳答案， @拾指相扣 应该是对的。

测试如下：

const a = [{ aa: 1, b: 2 }];

console.log(a[0]);

const foo = function foo(value) {
  value.aa = 5;
};

a.forEach(foo);

console.log(a[0]);

Answer 4

console.log(a)，a是对象，输出的是这个对象本身，不是输出它在某一时刻的快照，所以第一个和log出来的和第二个log出来的都是a这个对象，他们当然是一样的
这种情况，你想要观察一个对象某个时候的状态，你深克隆一下它在log出来就行了

const a = [{ aa: 1, b: 2 }];
  console.log(JSON.parse(JSON.stringify(a)));
  const foo = function foo(value) {
    value.aa = 5;
  };
  a.forEach(foo);
  console.log(a);