How To Add Values To An Array Of Objects Dynamically In Javascript?

this is an array of objects, var data = [ {'label' : '1', 'value' : 12}, {'label' : '1', 'value' : 12}, {'label' : '1', 'value' : 12}, {'label' : '1', 'valu

Solution 1:

You have to instantiate the object first. The simplest way is:

var lab =["1","2","3"];
varval = [42,55,51,22];
vardata = [];
for(var i=0; i<4; i++)  {
    data.push({label: lab[i], value: val[i]});
}

Or an other, less concise way, but closer to your original code:

for(var i=0; i<4; i++)  {
   data[i] = {};              // creates a new objectdata[i].label = lab[i];
   data[i].value = val[i];    
}

array() will not create a new array (unless you defined that function). Either Array() or new Array() or just [].

I recommend to read the MDN JavaScript Guide.

Solution 2:

In Year 2019, we can use Javascript's ES6Spread syntax to do it concisely and efficiently

data = [...data, {"label": 2, "value": 13}]

Examples

var data = [
      {"label" : "1", "value" : 12},
      {"label" : "1", "value" : 12},
      {"label" : "1", "value" : 12},
    ];
    
data = [...data, {"label" : "2", "value" : 14}] 
console.log(data)

For your case (i know it was in 2011), we can do it with map() & forEach() like below

var lab = ["1","2","3","4"];
var val = [42,55,51,22];

//Using forEach()var data = [];
val.forEach((v,i) => 
   data= [...data, {"label": lab[i], "value":v}]
)

//Using map()var dataMap = val.map((v,i) => 
 ({"label": lab[i], "value":v})
)

console.log('data: ', data);
console.log('dataMap : ', dataMap);

Solution 3:

const [alarmData, setAlarmData] = useState([])
 
consthandleConfirm = (date) => {
        console.log("A date has been picked: ", date);  
       // received new Date alarm time every timeconst formatedTime =  moment(date).format('hh:mm A')     

        const myData = [...alarmData]
        myData.push(""+formatedTime);
        setAlarmData(myData);    
    };