I have simple function that gets run on button press. If I press the reset button, I see FIRST console.log in console right away, an array with 5 objects. After 5 seconds, I see SECOND console.log with an empty array, so everything works well. The problem is if I press the reset function and do not open FIRST console.log in console. I wait 5 seconds and then open FIRST and SECOND console.log and both of them have empty arrays. Why?
It's like the FIRST console.log got updated. Function works good, problem is just in console.log.
reset: () => {
console.log("FIRST", world.bodies)
setTimeout(() => {
for (let i = 0; i < objectBoxToUpdate.length; i++) {
const rigidBody = objectBoxToUpdate[i].rigidBodyBox
world.removeRigidBody(rigidBody)
}
console.log("SECOND", world.bodies)
}, 5000)
}
per MDN reference,
Information about an object is lazily retrieved. This means that the log message shows the content of an object at the time when it's first viewed, not when it was logged. For example:
const obj = {};
console.log(obj);
obj.prop = 123;
This will output {}. However, if you expand the object's details, you will see prop: 123.
so, you need to deep-clone the object if you're going to see the object at the time it was logged. you can use structuredClone, or plain-old JSON.parse(JSON.stringify(obj))
in case structuredClone isn't supported by runtime.