slice（）を使用した後に配列が変更されるのはなぜですか？

Question

私のapp-config.jsファイルから変数にロードして、その状態が変更されないようにするために.slice（）でコピーしています。私の嫌悪感の多くは、私がデータを変更するために使用している機能は、突然変異を避けるこの試みを尊重していないようです。 mySensitivityVarsは変化し続けますが、私はちょうどmySeriesに直接的に作用しているので、私はどうしたらよいか分かりません。なぜこれが起こっているのかについてのアイデアはありますか？ここでは、コードがあります：

var mySeries = mySensitivityVars.slice(); 


//Dummy Processing Algorithm 
    function myDummyAlgo(sliderIndex, newValue, range) { 
     console.log(mySeries[sliderIndex].data) 

     var modifier = newValue/(range/2) 
     var newSeries = mySensitivityVars[sliderIndex].data.map(function(num){ 
      return num * modifier 
     }) 
     console.log(newSeries) 
     // mySeries[sliderIndex].data = newSeries 

     // console.log(sensitivityChart.series[0].data) 
     sensitivityChart.series[sliderIndex].setData(newSeries); 
    }; 

Answer 1

mySensitivityVarsの内容を見ることなく、それは言うのは難しいのですが、私の推測では、あなたは元のオブジェクトではなく、重複したオブジェクトへの参照を変異しています。

mySensitivityVarsに何かオブジェクトがありますか？その場合、mySeriesの対応するオブジェクトは、スタンドアロンの複製ではなく、mySensitivityVarsの元のオブジェクトを指しているため、おそらく突然変異の問題が発生しています。

Answer 2

スライスは配列をコピーすることができますが、配列内で参照されているすべてのオブジェクトは、あなたが行うと（参照だけがコピーされます）

Answer 3

コピー取得されていません。

mySeries[sliderIndex].data newSeries; 

が配列mySeriesがコピーでありますmySensitivityVarsですが、配列内のオブジェクトはコピーではありません。両方の配列には同じオブジェクトへの参照が含まれており、dataプロパティを変更するとその両方に影響します。

mySeries = mySentitivyVars.map(o => Object.assign({}, o)); 

オブジェクトに他のオブジェクトへの参照が含まれている場合は、ディープコピーを行う必要があります。 What is the most efficient way to deep clone an object in JavaScript?

Answer 4

突然変異させたい場合は、コピーするのではなく複製する必要があります。 JSON.parse（JSON.stringify（mySensitivityVars））を使用することができます。これはかなり高速な深層クローニング技術です。 は、新しいオブジェクトが確実に割り当てられ、参照のコピーは保証されません。