JS Object created with for/in returning the same object to the array multiple times

Question

I have an object data looks like this:

{
    "Meta Data": {
        "1. Information": "Intraday (5min) open, high, low, close prices and volume",
        "2. Symbol": "IBM",
        "3. Last Refreshed": "2021-09-09 18:05:00",
        "4. Interval": "5min",
        "5. Output Size": "Compact",
        "6. Time Zone": "US/Eastern"
    },
    "Time Series (5min)": {
        "2021-09-09 18:05:00": {
            "1. open": "137.8300",
            "2. high": "137.8300",
            "3. low": "137.8300",
            "4. close": "137.8300",
            "5. volume": "104"
        },
        "2021-09-09 17:25:00": {
            "1. open": "137.7500",
            "2. high": "137.7500",
            "3. low": "137.7500",
            "4. close": "137.7500",
            "5. volume": "478"
        },
        "2021-09-09 16:30:00": {
            "1. open": "137.8000",
            "2. high": "137.8000",
            "3. low": "137.8000",
            "4. close": "137.8000",
            "5. volume": "459"
        },
    }
}

Here is my function:

const myfunction = () => {
  var newArray = []
  var newObject = {}
  var firstobj = myobject['Time Series (5min)']

  for (var key in firstobj) {
    console.log(key)
    newObject.x = key.substr(11, 19)
    newObject.y = myobject['Time Series (5min)'][`${key}`]['4. close']

    newArray.push(newObject)
  }
  return newArray
}

console.log(myfunction())

JS Object created with for/in returning the same object to the array multiple times. I am not sure why I cant see the bug, or where I am going wrong. Does anybody know how I am supposed to be returning the object to the newArray so that it creates a list of {x: 1234, y: 1234}. (just example numbers, see image attached to this view code / console together. The first part of the console is the end of the logged keys, and the 2nd part of the console is the start of the log for the array of objects, [{x: 1234, y: 1234}, {x: 1234, y: 1234}] I would like to return!

Result needs to be:

[{ x: '15:50:00', y: '138.3550' },
 { x: '15:55:00', y: '134.3250' }]

not:

[{ x: '15:50:00', y: '138.3550' },
 { x: '15:50:00', y: '138.3550' }]

PS: I have returned the structure as an array, but not as an array of objects. I just wanted to say that I am calling the API correctly, just maybe not referencing it properly.

PPS: If there is a much simpler way to do this, please let me know what you would do!

3limin4t0r · Accepted Answer · 2021-09-11 02:44:40Z

1

You push your newArray full with references to the same object.

const obj = { x: 0, y: 0 };
const newArray = [obj];

obj.x = 1;
newArray.push(obj);

// since index 0 and 1 refer to the same object they will now "both" be
// { x: 1, y: 0 }

So instead of using a single object, create a copy and then update the properties:

for (var key in firstobj) {
  console.log(key)
  const copy = { ...newObject }; // create a shallow copy

  // Setting x and y don't update newObject, and objects pushed to
  // newArray are distinct objects.
  copy.x = key.substr(11, 19)
  copy.y = myobject['Time Series (5min)'][`${key}`]['4. close']

  newArray.push(copy)
}

answered Sep 11, 2021 at 2:44

3limin4t0r

21.4k3 gold badges38 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Chris Canin Over a year ago

Thanks so much! This really helped, and was able to teach me where I was going wrong!

Dhana D. · Accepted Answer · 2021-09-11 03:00:19Z

Instead of creating a new variable for temporary storage of value, you may just put it altogether in the push itself like this:

array.push({x: data_x, y: data_y})

Here's the full working code:

const data = {
    "Meta Data": {
        "1. Information": "Intraday (5min) open, high, low, close prices and volume",
        "2. Symbol": "IBM",
        "3. Last Refreshed": "2021-09-09 18:05:00",
        "4. Interval": "5min",
        "5. Output Size": "Compact",
        "6. Time Zone": "US/Eastern"
    },
    "Time Series (5min)": {
        "2021-09-09 18:05:00": {
            "1. open": "137.8300",
            "2. high": "137.8300",
            "3. low": "137.8300",
            "4. close": "137.8300",
            "5. volume": "104"
        },
        "2021-09-09 17:25:00": {
            "1. open": "137.7500",
            "2. high": "137.7500",
            "3. low": "137.7500",
            "4. close": "137.7500",
            "5. volume": "478"
        },
        "2021-09-09 16:30:00": {
            "1. open": "137.8000",
            "2. high": "137.8000",
            "3. low": "137.8000",
            "4. close": "137.8000",
            "5. volume": "459"
        },
       }
      };



const myfunction = (myobject) => {
  var newArray = [];
  var firstobj = myobject['Time Series (5min)'];

  for (var key in firstobj) {
    console.log(key)

    newArray.push({
      x: key.substr(11, 19),
      y: myobject['Time Series (5min)'][`${key}`]['4. close']
    });
  }
  return newArray
}

console.log(myfunction(data))

m4n0 · Accepted Answer · 2021-09-11 05:56:24Z

1

This is because newObject is updated every time whenever it calls. So it keeps the last one as a variable. Check this picture.

enter image description here

edited Sep 11, 2021 at 5:56

m4n0

32.6k28 gold badges81 silver badges98 bronze badges

answered Sep 11, 2021 at 4:05

Codshark11

873 silver badges14 bronze badges

Collectives™ on Stack Overflow

JS Object created with for/in returning the same object to the array multiple times

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related