Best approach to get multiple keys from an immutable map? - ecmascript-6

Question

What is the best way to get multiple values from an immutable map?
const example = new Map({
id: 1,
first: 'John',
last: 'Smith',
age: '99',
gender: 'M',
children: new List([7,8,10]),
});
Using toJS() has been an approach:
const {
first,
last,
age,
gender
} = example.toJS();
But if I were to pull in children it would no longer be an immutable list.
Using get():
const first = example.get('first');
const last = example.get('last');
...
This maintains the type of children, but seems like extra cycles and key strokes.
Any thoughts?
I know this can be an opinionated question, but I'm looking for something with merit, please include stats (key strokes, cycles) to support your answer.

Answer 1

Personally I would probably just stick with the .get()s, but if you want to be able to use destructruing, you could try the .toJSON() method. It's like .toJS() but it only does a shallow conversion to either an object or an array. You could also use .toObject() or .toArray() if you know what type you'd like to turn it into (which you must if you're destructuring it).
const m = Immutable.fromJS({
a: {a2: 'a3'},
b: [1, 2, {f: 'f'}],
});
const { a, b } = m.toJSON();
console.assert(Immutable.isImmutable(a) && Immutable.isImmutable(b));
console.log('a =', a);
console.log('b =', b)
const [ c, d, e ] = b.toArray();
console.assert(c == 1 && d == 2 && Immutable.isImmutable(e));
const { f } = e.toObject();
console.assert(f === 'f');
<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/4.0.0-rc.9/immutable.js"></script>
I made a jsperf since you mentioned you wanted stats. For me using Chrome 63 on a MacBook Pro, .get is about 3x as fast as .toJSON