javascript - 当实际上没有要添加的值时向对象值添加值

Question

你好我有以下功能

var f = {i:0}; 
  var t=0; 
  function change(f, t) { 
    f.i++; 
    t++;
}
change(f,t);

当我在控制台日志中看到值“f = {i:1}, t=0” 我可以知道如何将 1 添加到 i 而不是 t 中吗？有什么想法吗？我完全迷失在这里。

Answer 1

这是因为 JavaScript 对象是按引用传递的，而标量值是按值传递的。

因此，当您将对象传递给函数并直接改变它们时，您实际上是在引用内存中的同一个对象。

var f = {
  i: 0
};
var t = 0;

function change(f, t) {
  f.i++;
  t++;
  console.log(f, t);
}
change(f, t);
console.log(f, t);

为避免意外改变您的对象，您必须在对其执行操作之前创建该对象的新实例。有多种方法可以实现这一点:

• Destructuring/spreading你的参数 function({...f}, t)
• 使用Object.assign()
• 将函数中的 f 分配给 destructured f (f = {...f};)

例如:

var f = {
  i: 0
};
var t = 0;

function change(f /*{...f}*/, t) {
  f = { ...f};
  // Or alternatively,
  // f = Object.assign({}, f);
  f.i++;
  t++;
  console.log(f, t);
}
change(f, t);
console.log(f, t);

值得注意的是，重新分配对象不会更新值。请查看Call by sharing .

var f = {
  i: 0
};
var t = 0;

function change(f, t) {
  f = {i: 1};
  t++;
  console.log(f, t);
}
change(f, t);
console.log(f, t);