How to handle if/else in functional JavaScript transform of Immutable objects for debugging

Question

var data = {
  type: 'TEST',
  active: true,
  letters: Immutable.Map({ 'a': true, 'b': false })
};

var dataToLog = _.object(
  _.map(data, function(v, k) {
    if (Immutable.Iterable.isIterable(v)) {
      return ['*Immutable* - ' + k, v.toJS()];
    } else {
      return [k, v];
    }
  })
);

console.log('Output: ', dataToLog);

"Output: "
[object Object] {
  *Immutable* - letters: [object Object] {
    a: true,
    b: false
  },
  active: true,
  type: "TEST"
}

I have this in a JSBin here.

Using lodash and some of the transform methods to manipulate Immutable objects flowing through my Flux Dispatcher to JSON for easier debugging and also indicate by prepending 'Immutable' to the key's name in the output. It works well, but I'm learning about using _.map, _.compose, _.curry, and wonder if this could be made even more functional.

Specifically, I'm wondering how to handle this if/else that's in my function sent to _.map:

if (Immutable.Iterable.isIterable(v)) {
  return ['*Immutable* - ' + k, v.toJS()];
} else {
  return [k, v];
}

I'm not understanding how I can transform this into something functional other than making the check for Immutable and return of that into separate functions that check for Immutable values of the object and another to transform it to JSON (making the call to Immutable's .toJS()).

I'm also struggling with how to operate on this and get the desired output while operating on this as an object instead of having my map function return an array of the key and value.

To clarify, the goals for the overall transformation:

Iterate over an object with key, value
If value is NOT an Immutable object, return key and value unaltered
If value IS an Immutable object, modify key to be prefixed with 'Immutable' and call .toJS() on value and return those transformations

What's not "functional" about that? (One thing: if ... else where the if clause always ends with return is redundant. You just need an if and no else.) — Pointy
– Pointy, Commented Jul 25, 2015 at 18:09
I'm not sure about the rest of your question, but with lodash, you can use the transform method. _.transform(data, function(result, v, k) { if(Immutable.Iterable.isIterable(v)) return result['*Immutable* - ' + k] = v.toJS(); else return result[k] = v; }); — Sean Hill
– Sean Hill, Commented Jul 25, 2015 at 23:47

Jeremy Larter · Accepted Answer · 2015-08-03 11:42:49Z

Here is a corrected version of your code to meet your transformation goal. You were very close in the jsbin code.

(function (_) {
  "use strict";

  function immutableToJS(result, v, k) {
    if (Immutable.Iterable.isIterable(v)) {      
      result['*Immutable* - ' + k] = v.toJS();
    } else {
      result[k] = v;
    }
  }

  var data = {        
        type: 'TEST',
        active: true,
        letters: Immutable.Map({ 'a': true, 'b': false })
      },
      answer = _.transform(data, immutableToJS),
      expectedAnswer = {type: 'TEST', active: true};
  expectedAnswer["*Immutable* - letters"] = {a:true,b:false};

  console.log('answer: ' + JSON.stringify(answer));
  //console.log('expectedAnswer: ' + JSON.stringify(expectedAnswer));
  //console.log(_.isEqual(answer,expectedAnswer));//true
}(_));

http://jsbin.com/somona/edit?js,console

Possible points of confusion in the question:

_.transform versus _.reduce because OP's immutableToJS() function in the jsbin code had return statements. _.transform only uses return false; to stop iterating.
Using the word "functional" to mean "working" in this line: "...transform this into something functional...". The comments indicate that people were reading it as "functional-programming style".
Phrasing of "... handle this if/else ..." when what was meant was "fix the if/else because it is not working". The comments indicate that people were reading the phrase as "take away the if/else and replace it with code that uses a functional-programming approach instead" (compounded by point 2 above).

Collectives™ on Stack Overflow

How to handle if/else in functional JavaScript transform of Immutable objects for debugging

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related