时间戳

首页 > 解决方案 > 仅更改 javascript 地图的一个实例

javascript - 仅更改 javascript 地图的一个实例

问题描述

只是想知道最好的方法是什么。我设置了一个javascript地图。然后我将地图的实例分配给一个对象。但是，当我更改对象的一个​​实例时，它会更改地图的其他实例。因此，如果您运行下面的代码，您会注意到所有冷实例的温度都更改为 10，如果只是最后一个实例，它应该这样做。

我在下面放了一个可运行的片段。而且我这里也有一个小提琴 https://jsfiddle.net/bupLsf9n/ （我认为在小提琴上阅读console.log更容易）

var myMap = new Map([
  ["hot", { temperature: 100 }],
  ["warm", { temperature: 50 }],
  ["cold", { temperature: 0 }],
]);

var data = [
  { id: 1, map: myMap.get("hot") },
  { id: 2, map: myMap.get("warm") },
  { id: 3, map: myMap.get("cold") },
  { id: 4, map: myMap.get("hot") },
];
$(document).ready(function() {
  data.filter(x => x.id == 4)[0].map.temperature = 10;
  console.log(data);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

标签： javascriptdictionaryecmascript-6

解决方案

如果您希望 data[x].map 成为 Map 的不同实例，您最终可以这样做，但我不确定这是否是您想要的：

var myMap = () => new Map([
  ['hot', {
    'temperature': 100
  }],
  ['warm', {
    'temperature': 50
  }],
  ['cold', {
    'temperature': 0
  }],
]);

var data = [{
    id: 1,
    map: myMap().get('hot')
  },
  {
    id: 2,
    map: myMap().get('warm')
  },
  {
    id: 3,
    map: myMap().get('cold')
  },
  {
    id: 4,
    map: myMap().get('hot')
  },
]
$(document).ready(function() {
  data.filter(x => x.id == 4)[0].map.temperature = 10;
  console.log(data[0]);
  console.log(data[3]);
  //data[0].map != data[3].map
});

--

var myMap = () => new Map()

此行返回一个创建 Map 新实例的函数，这就是为什么您必须像在数据数组中那样调用它map : myMap()以获取每个条目的新实例

编辑 ：

如果您想要特定值的副本而不是 Map 的新实例，您可以保留您的var myMap = new Map([...])声明并对每个条目执行此操作：

  var data = [{
    id: 1,
    map: Object.assign({}, myMap.get('hot'))
  }, //etc...
  ]

但就像@Pointy 在评论中说的那样，这只会制作对象的浅拷贝，希望对您有所帮助

推荐阅读