Weird array output TS/Angular

Issue

I'm trying to sort data from API for chart, so I need to filter it based on currency name so I can get their rates.

Algo is working properly but I'm getting weird output in my browser and chart also.

Output from tempRates in browser looks like this: [7.4429, 7.4429, 7.4392, 7.4392] which is the correct output.

But when I expand the same array in the browser console I get this output:

(4)[7.4429, 7.4429, 7.4392, 7.4392]
  0: 1
  1: 1
  2: 1
  3: 1

And that goes for all arrays.

But value of last array is (4)[1, 1, 1, 1] and that is the expected output.

Object.keys(data.rates).forEach((key) => {
 this.data.labels.push(key); // date
});

Object.values(data.rates).forEach((value) => {
 tempCurrency = Object.keys(value)[i];

 Object.values(data.rates).forEach((rate) => {
   if (tempCurrency === Object.keys(rate)[i]) {
     tempRates.push(rate[tempCurrency]);
     //tempRates.push(Math.round(Math.random() * 100));
   }
 });
            
 console.log("log before push", tempRates);
 this.data.datasets.push({
  label: tempCurrency,
  data: tempRates,
  });
  i++;

  if (!(i === Object.keys(data.rates).length)) {
      tempRates.length = 0;
  }
});

I also have tried with random numbers and the output still has the same problem. All arrays have the value of last array.

Console screen shoot

Solution

All I had to do was change the tempRates.length = 0; to tampRates = [].

I just don't know what is the difference between those two solutions. I would be grateful if someone could explain it to me.

Answered By - Imra Kočiš