javascript - 从不可变的 JS 对象中删除属性

Question

在我的react-native应用程序中，我想删除redux中的js对象的一个​​属性。

这是我的代码。

    case SAVE_PLAYLIST:
        const { toPlayListFrom, selectedPlaylist } = action.payload;

        let newPlaylists = // state.savedPlaylists;
            Object.keys(selectedPlaylist).length > 0
                ?  {
                    ...state.savedPlaylists,
                    [toPlayListFrom]: selectedPlaylist
                }
                : delete state.savedPlaylists[toPlayListFrom];

        return {
            ...state,
            savedPlaylists: newPlaylists
        }

在这一行中，delete state.savedPlaylists[toPlayListFrom]它不会按预期删除该属性。如何以正确的方式从不可变的 js 对象中删除属性？

Answer 1

您的delete声明是错误的。该命令通常返回 true(少数情况下可能返回 false。)

此外，正如 T.J. Crowder，您不想修改 state 变量。

首先您要创建数据的副本，然后对该副本应用删除。

case SAVE_PLAYLIST:
    const { toPlayListFrom, selectedPlaylist } = action.payload;

    let newPlaylists = // state.savedPlaylists;
        Object.keys(selectedPlaylist).length > 0
            ?  {
                ...state.savedPlaylists,
                [toPlayListFrom]: selectedPlaylist
            }
            : ...state.savedPlaylists;

    // only apply a delete to the copy, not the original
    //
    if (Object.keys(selectedPlaylist).length === 0) {
        delete newPlaylists.savedPlaylists[toPlayListFrom]
    }

    return {
        ...state,
        savedPlaylists: newPlaylists
    }

在 JavaScript 中需要记住的一件事是对象使用引用。因此，如果您不首先制作副本，那么您正在更改所述对象(或者至少尝试将某些对象标记为不可变(实际上是 const)，因此无法修改。 )

我确信有办法优化上述代码。