使用属性分配对象或分配给属性有什么区别？

Question

我正在学习使用函数编辑数组，并遇到了这两个相似的函数。我想知道它们之间有什么区别。它们对我来说都是一样的，但是使用其中之一有更多的优点还是缺点？

function edit(position, newTodoText){
    userTodos[position] = ({todoText: newTodoText});            
    console.log(userTodos);
}

和

function edit(position, newTodoText){            
    userTodos[position].todoText = newTodoText;
    console.log(userTodos);
}

Answer 1

一个区别是第二个选项要求 userTodos[position] 对象已经存在，如果不存在将导致异常。

Uncaught TypeError: Cannot set property 'todoText' of undefined

另一个区别是第二个选项执行突变（这意味着它编辑现有的待办事项），而第一个选项在同一位置创建一个新的待办事项（旧的通过称为垃圾收集的东西删除）

下面是一些带有注释的代码以说明差异：

function optionOneInserts(x) {
  x[0] = { name: "alice" };
}

function optionTwoMutates(x) {
  x[0].name = "alice";
}

let x1 = [{ name: "bob" }];
let x2 = [{ name: "bob" }];

let previousFirstItemInX1 = x1[0];
let previousFirstItemInX2 = x2[0];

console.log("Current first item in x1 and x2:");
console.log(`current x1[0] = ${JSON.stringify(previousFirstItemInX1)}`);
console.log(`current x2[0] = ${JSON.stringify(previousFirstItemInX2)}`);

console.log(`\n...performing options one and two`);
optionOneInserts(x1);
optionTwoMutates(x2);

console.log("\nboth options end up with same values in x1 and x2:");
console.log(`x1 = ${JSON.stringify(x1)}`); // [{ name: 'alice' }]
console.log(`x2 = ${JSON.stringify(x2)}`); // [{ name: 'alice' }]

console.log(
  "\nbut the first option leaves its old first value untact and adds a new value, while the second option changes the old value instead:"
);

console.log(`previous current x1[0] = ${JSON.stringify(previousFirstItemInX1)}`);
console.log(`previous current x2[0] = ${JSON.stringify(previousFirstItemInX2)}`);

Answer 2

第一种形式将在给定位置创建一个新对象，其中只有一个属性，而第二种形式将使用给定的属性和内容在该位置扩展一个已经存在的对象。

为了使第二种形式更“宽容”一些，您可以将其修改为

function edit(position, newTodoText){            
        (userTodos[position]=userTodos[position]||{}).todoText = newTodoText;
        console.log(userTodos);
}

const userTodos=[{done:"object created"},{todoText:"nothing"}];

edit(3,"something else");
edit(2,"and also this");
edit(0,"fill it up!");

(userTodos[position]=userTodos[position]||{}) 将在给定位置创建一个新对象，如果它还不存在，否则它将继续使用（=扩展）已经存在的对象。

使用属性分配对象或分配给属性有什么区别？

What is the difference between assignment of object with property, or assigning to property?

javascript

arrays

function

edit

使用 属性 分配对象或分配给 属性 有什么区别？

What is the difference between assignment of object with property, or assigning to property?

javascript

arrays

function

edit

使用属性分配对象或分配给属性有什么区别？