Tengo algunos problemas para averiguar por qué un objeto que paso a otra función no se modifica como se esperaba.

Supongamos que tengo lo siguiente:

 const doSomethingAsync = async ({ data }) => new Promise((resolve) => setTimeout(() => { data = { id: 5 }; resolve(); }, 1000)); const mainFunc = async () => { let data = {}; console.log('before', data); // prints {} await doSomethingAsync({ data }); console.log('after', data); // prints {} } await mainFunc();

Los data variables nunca se modifican.

Lo raro es que si cambio,

 let data = {};

a,

 const response = { data: {}, };

entonces funciona bien:

 const doSomethingAsync = async ({ response }) => new Promise((resolve) => setTimeout(() => { response.data = { id: 5 }; resolve(); }, 1000)); const mainFunc = async () => { const response = { data: {}, }; console.log('before', response.data); // prints {} await doSomethingAsync({ response }); console.log('after', response.data); // prints { id: 5 } } await mainFunc();

Sé que los objetos se pasan por referencia, pero eso es exactamente lo que estoy haciendo en el primer ejemplo. ¿Qué estoy haciendo mal aquí?