Javascript 对象分配问题

Question

我在为数据表构建排序按钮时遇到了这个问题。我想让每个排序按钮在 DESC（向下排序）和 ASC（向上排序）和非活动状态之间切换 - 默认排序。

所以我创建了两个模型，一个是随着程序的进行而改变的模型，一个是重置值的默认模型

var model = {
  order: {
    field: 'creationDate',
    direction: 'DESC'
  },
  orderDefault: {
    field: 'creationDate',
    direction: 'DESC'
  }
}

$('button').click(function() {
  if (model.order.field == "creationDate") {
    model.order.field = 'newField'
  } else if (model.order.direction == 'DESC') {
    model.order.direction = 'ASC'
  } else {
// This casuses the orderDefault object to be a clone of the order object
// so assignment of values in model.order are refelected in model.orderDefault GOTCHA!!!!
    model.order = model.orderDefault
  }
  $('#result').html('field:' + model.order.field + " direction:" + model.order.direction);
}
)

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<button class="btn btn-primary">
  click me
</button>

<div id="result">

</div>

因此，您将看到这一切都按预期工作，直到我们重置订单对象为止。我们第二次在代码中到达这一点时，您会看到它永远不会重置。似乎 orderDefault obj 成为 order obj 的别名。

Answer 1

答案是，您需要分配 orderDefault 的值，而不是分配 orderDefault

所以不

model.order = model.orderDefault

但是

 model.order.direction = model.orderDefault.direction
 model.order.field = model.orderDefault.field

我希望这对某人有所帮助。