Question

为什么在这种情况下，

＆＃13;

<div>
  <a href="x">Yes this is a very long text but it </a>
  <span class="common"><a href="x">helps</a> <button class="xx">i</button></span>
</div>

＆＃13;

var a={b:1}; Object.assign(a,{b:a.b+2},{b:a.b+4}); console.log(a);的结果是对象

assign

而不是

{b: 5}

对于使用此记录的记录，我试图解释为什么值在下面的代码中为1

{b: 7}

Answer 1

因为参数在传递给函数之前被计算。你基本上在做

var a = {b: 1},
    tmp1 = {b: a.b+2}, // {b: 1+2}
    tmp2 = {b: a.b+4}; // {b: 1+4}
Object.assign(a, tmp1, tmp2);

你需要做

var a = {b: 1};
Object.assign(a, {b: a.b+2}); // simpler: a.b += 2
Object.assign(a, {b: a.b+4}); // simpler: a.b += 4

获取7。

Answer 2

预计会有结果。因为Object.assign 不是和值，而是覆盖。它从右到左设置值。正确的值为{b: a.b+4} => {b: 5}。该值与其他值重叠。

Answer 3

Object.assign和React的setState的工作方式不同。对于Object.assign，您可以将其视为对象的从右到左合并：

Object.assign(a,{b:a.b+2},{b:a.b+4});
Object.assign(a,{b:3},{b:5});
Object.assign(a,{b:5});

然而，setState是另一回事。这是一个异步操作。在您的情况下，您只需执行三次完全相同的语句：

this.setState({ value: 0 + 1});
this.setState({ value: 0 + 1});
this.setState({ value: 0 + 1});

多个setState调用可以在一个事件循环中更新状态，并导致单个重新渲染。 setState工作方式背后的部分架构效率可能是造成这种行为的原因。此参考也可能有所帮助：

Why is setState giving me the wrong value?

如果你想使用setState操作的先前值，你可以这样做：

setState((prevState) => ({ value: prevState.value + 1 }));

或

setState({ value: this.state.value + 1 }, () => {
    // In here, the state has been updated
});

然而，由于您的示例是人为的，因此很难提供精确的实际解决方案，并且可能没有实际需要执行此类顺序setState操作。

有关setState的详细信息，请参阅React documentation。

在这种情况下的Object.assign行为

3 个答案: