如何在 Javascript 中永久更新地图

Question

我正在使用ReduxforReact并尝试更改包含 a 的状态Map，但我不确定如何正确执行此操作。

我正在尝试使用此处列出的更新模式（但它们仅显示对象和数组的示例）： https ://redux.js.org/recipes/structuring-reducers/immutable-update-patterns

我有一个像这样的常量地图：

const propertiesMap1 = new Map([
["TITLE1",
    {
        propertyValues: {
            myProperty1 : "myVal1",
            myProperty2 : "myVal2",
            myProperty3 : "myVal3",                                                            
        },
        isOpen: true
    }
],
....

数组中有 2 个这样的映射：const arr = [map1, map2]

我正在尝试更新特定地图中的值，如下所示：

function updateValueInProperties(array, index, category, value) 
{

return array.map( (item, index) => 
{
    if(index !== action.index) 
    {
        return item;
    }


    // Otherwise, this is the one we want - return an updated value
    return {
        ...item,
        item.get(category): {

        }
    };    
});

}

但上面有编译错误..

我究竟如何不可更改地更新地图？

Answer 1

简短回答：

\n\n

要创建 \xc2\xbbupdated 克隆\xc2\xab：new Map(oldMap).set('x', 'y')或new Map(oldMap).delete('x').

\n\n

总长DR

\n\n

映射的构造函数接受一个可迭代对象，而映射就是其中之一。例如：

\n\n

const \n  m1 = new Map().set('x1', 'y1').set('x2', 'y2'),\n  m2 = new Map([...m1.entries()])\n;\n\nm1 === m2 // false;\nm2.get('x1') // y1\n

\n\n

因此，要以创建新地图的方式更新地图，您可以使用 将旧地图转换为数组.entries()，更新此数组并将其转回地图。

\n\n

//update a value\nconst updated = new Map([...m1.entries()].map(\n  ([key, val]) => [\n    key, \n    key == 'x1' ? `updated ${val}` : val \n  ]\n));\n

\n\n

甚至更短，感谢@VLAZ 的所有评论

\n\n

const clone = new Map(oldMap).set('x', 'y')\n

\n\n

概括

\n\n

对于flat copy可以使用的映射并new Map(old)创建修改后的克隆，可以使用所有这些delete()或新映射的方法。中间阵列可以为过滤等提供更大的灵活性，但会带来一些性能成本。set()clear()

\n