Javascript 反应：导致追溯性副作用的排序功能我的商店？

工具：

ReactJS0.14.0

香草通量（不确定这是否会影响此问题的性质

---

今天我遇到了一个让我挠头的bug。在我的商店里，我试图访问数组中的第一个元素，但它不是预期的元素。

我在数组进入存储时打印了它，甚至在它发出后，存储被更新，数组看起来像它应该的样子，但是如果我访问它，例如

data[0]

它就不会显示打印结果

之后，我终于发现在将数据发送到存储区后调用了排序。

像这样：

ServerActionCreators.receiveData(data);
data.sort(mySortingFunction);

我的问题：

---

为什么要追溯更新存储中的数据？开发者如何确保这些追溯性副作用不会影响存储的同步操作？出现问题的原因是您和存储都持有对相同数组的引用，并且该方法会对其进行变异

可以通过远离直接变异数组的方法来避免这种行为（

push

、

pop

、

shift

、

unshift

、

reverse

和

sort

）或

在执行这些操作之前复制数组

var data = [ ... ];

// give the store a reference
MyStore.sendData(data);

// copy the reference before mutating it
var sorted = copy(data).sort(sortFn);

// continue to work with the copy
// ...

复制对象或列表的方法有很多，具体取决于您使用的Javascript版本

// ES7
const copy = list => [...list]
// ES6
const copy = list => Object.assign([], list);
// ES5
function copy(list) {
  return list.map(function(item) {
    return item;
  });
}

或者，您可以使用不可变或来解决此问题

// mori.js
var data = mori.vector( ... ),
    sorted = mori.sort(sortFn, data);

// immutable.js
var data = Immutable.list( ... ),
    sorted = data.sort(sortFn);

根据定义，当您调用这些数据结构的方法时，它们不会发生变化