Question

在开发过程中，我注意到Redux DevTool中发生了一些魔术。我发现，在我以初始状态声明undefined时，它消除了商店中的字段。另一方面，当我将它们声明为null时，它们会再次出现在DevTool中。

因此，我的问题是为什么redux devtool仅显示null字段而隐藏undefined？

我确实感觉到，将字段声明为null可以节省我每次想回顾一下状态的时间（因为我可以在redux devtool中检查它们）的情况。因此，开发人员/调试人员的经验会更好。

我的初始状态（null声明）

const initialState = {
    data: null,
    pending: {
           flag: false
    },
    error: null
};

在Redux Devtool中：

data(pin): null
pending(pin): {...}
error(pin): null

我的初始状态（undefined声明）

const initialState = {
    data: undefined,
    pending: {
           flag: false
    },
    error: undefined
};

在Redux Devtool中：

pending(pin): {...}

我希望这家商店可以轻巧，快捷，可以选择部分商品。有性能提升吗？

Answer 1

null和undefined是两个不同的值，这是有原因的。访问任何js值（除了这两个ofc之外）的未分配字段将返回undefined。因此，如果您这样做：

var foo = {};
foo.bar = undefined;

您将获得一个对象，该对象看起来像其bar字段一样未被分配：除了它并且您有foo.hasOwnProperty("bar") === true。虽然这令人困惑。这就是为什么使用缺少值 null并使用未分配值undefined的原因。有趣的是，在破坏数据结构时可以发现这种行为上的差异：

var { foo = "bar" } = { foo: undefined }

和

var { foo = "bar" } = { foo: null }

前者为foo === "bar"，后者为foo === null。

为什么redux devtool会忽略未定义的字段并保留空字段？

1 个答案: