This question already has answers here:
How do I correctly clone a JavaScript object?
                                
                                    (67个答案)
                                
                        
                2年前关闭。
            
        

只是想知道什么是最好的方法。我设置了一个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>

最佳答案

如果您希望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在评论中说的那样,这只会对对象进行浅表复制,希望对您有所帮助

07-24 09:50
查看更多