javascript - Different results after creating two JS objects from (seemingly) identical JSON -


i'll try frame in framework-agnostic manner, use case specific react/redux/redux-form.

i first thing out of store. important because if define object in place, things work fine. makes difficult reacreate error, though. so, i'll go through couple examples. first 1 works, rest don't. let's has following structure:

thing = {   foo: 'foo',   bar: ['bar'],   baz: 'baz' } 

this works fine

function mapstatetoprops(state) {   const { thing } = state.thing;   // thing = {   //   foo: 'foo',   //   bar: ['bar'],   //   baz: 'baz'   // }    // don't care `baz`, , don't want send downstream   // if hardcode this, works fine   // (except data dynamic,    // not real solution)   const workingobj = { foo: 'foo', bar: ['bar'] }    return (     { initialvalues: workingobj }   ); } 

this doesn't work, however

function mapstatetoprops(state) {   const { thing } = state.thing;   const brokenobj = { foo: thing.foo, bar: thing.bar };   return (     { initialvalues: brokenobj }   ); } 

i figured having issue references losing scope or something. let's try deep copy:

function mapstatetoprops(state) {   const { thing } = state.thing;   const brokenobj = json.parse(json.stringify(     { foo: thing.foo, bar: thing.bar }   );    return (     { initialvalues: brokenobj }   ); } 

here's same 1 in more detail... have no idea how workingobjstr , brokenobjstr parsed other identical objects.

function mapstatetoprops(state) {   const { thing } = state.thing;   const workingobj = { foo: 'foo', bar: ['bar'] };   const brokenobj = { foo: thing.foo, bar: thing.bar };    const workingobjstr = json.stringify(workingobj);   const brokenobjstr = json.stringify(brokenobj);   console.debug(workingobjstr === brokenobjstr);   // => true    return (     { initialvalues: json.parse(brokenobjstr) }   ); } 

so, question in general terms is: how 2 identical string objects produce different objects after being parsed? might there optimization voodoo going on behind scenes, or missing fundamental? can't imagine how downstream of return know these objects have been produced through different means, i'm stumped.

i'll note again can't think of how reproduce this... seems somehow tied redux environment, because if define thing object inside function scope things work fine.

i'll know initialvalues object formatted , propagating downstream because can see inside of form... redux-form doesn't pick unless created manually inside of mapstatetoprops function scope. again, have no idea how able tell difference, i'm missing silly...

thanks,

thomas


Comments