Immutable JS比较嵌套结构 [英] Immutable JS compare nested structures

问题描述

我有2个嵌套结构 newState 和 newState1 。

I have 2 nested structures newState and newState1.

但是当我比较他们的时候，equals（）或Immutable.is（）返回 false 。这些结构中的值完全相同。

But when I compare their, equals() or Immutable.is() returned false. The values in these structures identical.

如何正确比较 newState 和 newState1 ？

var grid = {
    editable: false,
    widgets: [{
        name: 'Some widget',
        type: 'List',
        defaultDataSource: 'daily',
        dataSources: {}
    }, {
        name: 'Some widget1',
        type: 'List',
        defaultDataSource: 'daily',
        dataSources: {}
    }]
};

var state = Immutable.fromJS(grid);

var newState = state.updateIn(['widgets'], function (list) {
    return list.push(Immutable.Map({
        name: 'Some widget2',
        type: 'List',
        defaultDataSource: 'daily',
        dataSources: {}
    }));
});

var newState1 = state.updateIn(['widgets'], function (list) {
    return list.push(Immutable.Map({
        name: 'Some widget2',
        type: 'List',
        defaultDataSource: 'daily',
        dataSources: {}
    }));
});

console.log(state.toJS(), newState.toJS(), newState1.toJS());

console.log(newState.equals(newState1)); //false

JSFiddle中的代码：
https://jsfiddle.net/z3xuagwm/

Code in JSFiddle: https://jsfiddle.net/z3xuagwm/

推荐答案

看起来immutablejs不做深层转换，所以如果你的值是object，它仍然是对象。

It seems that immutablejs don't do deep conversion, so if your value is object, it stays to be object.

由于你在每个更新中创建不同的对象步骤，并且那些对象将在彼此比较时被对待不同，因此您还应该将其转换为Immutable.Map对象，以使比较成为true。

As you're creating different object in each update step, and those objects will be treat different when you compare to each other, so you should also convert it to Immutable.Map object, to make the compare be true.

// Primitives.
var test1 = Immutable.Map({
    a: 'a', 
    b: 'b', 
    c: 'c'
});
var test2 = Immutable.Map({
    a: 'a',
    b: 'b',
    c: 'c'
});
console.log('Test primitive', test1.equals(test2)); // true

// Object
test1 = Immutable.Map({
    a: 'a',
    b: 'b',
    c: {}
});
test2 = Immutable.Map({
    a: 'a',
    b: 'b',
    c: {}
});
console.log('Test object', test1.equals(test2));  // false
// Its because
var a = {};
var b = {};
console.log('a === b?', a === b); // false

// Convert
test1 = Immutable.Map({
    a: 'a',
    b: 'b',
    c: Immutable.Map({})
});
test2 = Immutable.Map({
    a: 'a',
    b: 'b',
    c: Immutable.Map({})
});
console.log('Test converted', test1.equals(test2)); // true

<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.7.5/immutable.min.js"></script>

这篇关于Immutable JS比较嵌套结构的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！