Question

0

53

Views

Inser object tree into array/object by value

I want to use chart.js

The structure is not complete, but this doesn't mater - I think. And I have a prototype structure for yAxes. These should be inserted 3x in chartDef.options.scales.yAxes but BY VALUE so I can change the three parts independently. and the ID should be inserted. But doing like in my code, all three parts are changed to the same (last) number.

For me it looks like adding by value / by reference problem.

How can I solve?

Thank you

var yaxes_prototype ={
        ticks: {
            autoSkip: true,
            maxTicksLimit: 20,                      
            min: -1,
            max: 1,
            stepSize: 0.2
        }
}

    var chartDef = {
        type: 'line',
        data: {
            datasets: []
        },
        options: {
            responsive: true,
            showTooltips: true,
            hoverMode: 'index',
            stacked: false,
            scales: {
                xAxes: [],
                yAxes: []
            },
        }
    }

console.log("yaxes_prototype",yaxes_prototype)
for (var i=0 ; i<3 ; i++){
    //##### OK, but BY REFERENCE
    chartDef.options.scales.yAxes.push(yaxes_prototype); 
        // OK ,insert as newobject
    chartDef.options.scales.yAxes[i]["id"]=i        
        // key,:val was added, but all val the same 
}
console.log("chartDef",chartDef.options.scales)

7 months ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-07-04T10:34:55.873Z

The problem is you send the yaxes_prototype exact same three times.

This snippet below may help you see if the obj1 send as param are received exactly same object (by reference), that if you change any of it, all will change.

var obj1 = {name: "foo", value: "bar"};

(function() {
        if ( typeof Object.prototype.uniqueId == "undefined" ) {
            var id = 0;
            Object.prototype.uniqueId = function() {
                if ( typeof this.__uniqueid == "undefined" ) {
                    this.__uniqueid = ++id;
                }
                return this.__uniqueid;
            };
        }
    })();
    
function printId(obj) {
  console.log(obj.uniqueId());
}

for(var i=0; i<3; i++)
  printId(obj1);

Thus, you should copy that and resend as different variable/object in the loop:

var yaxes_prototype ={
        ticks: {
            autoSkip: true,
            maxTicksLimit: 20,                      
            min: -1,
            max: 1,
            stepSize: 0.2
        }
}

console.log("yaxes_prototype",yaxes_prototype)
for (var i=0 ; i<3 ; i++){
    var copyObj = {...yaxes_prototype}; // This copies the value stored in yaxes_prototype
    chartDef.options.scales.yAxes.push(copyObj); 
        // OK ,insert as newobject
    chartDef.options.scales.yAxes[i]["id"]=i        
        // key,:val was added, but all val the same 
}