ImmutableJS map to javascript object

Question

I've got an redux state like this :

const state = fromJS({
books: {
    "book1": {
        "name": "name1"
    },
    "book2": {
        "name": "name2"
    },
    "book3": {
        "name": "name2"
    }
}

});

I'm trying to create an selector that would give me a collection of books in form of JS object.

export const booksSelector = state => state.get('books');

I'm using this selector as :

const mapStateToProps = state => ({
  books: booksSelector(state),
});

But it returns Map - I've already checked docs and other placed and I shouldn't be doing any toJS() here. Is there any way to create a proper selector that would actually convert that map to an object? I've got lots of components that would use booksSelector and it seems like I might have to append books.toJS() in each of them which is kinda weird. Reselect library didn't help a lot.

does [this](https://stackoverflow.com/questions/27864706/when-to-use-tojs-with-immutable-js-and-flux) help at all? — Danny Buonocore, Sep 23 '19 at 04:41
Not really - each of them is using Maps inside their components anyway, which I would like to avoid as I have tons of components to update then (not just render functions, but also all other functions would have to use either .map or .toJS()) — Inveth, Sep 23 '19 at 04:53
Im not sure i understand. by a collection you mean a List and array. could you clarify what you mean by collection — jstuartmilne, Oct 10 '19 at 14:36

score 0 · Answer 1 · answered Oct 31 '19 at 13:22

If you want to convert that Map into JS object then the only way is toJS(). You can convert it into collection (Immutable Lists) and then pass it to every component. You can use Immutable API list functions to do every kind of processing.

export const booksSelector = state => state.get('books').toList();

I feel that converting Immutable objects to JS objects is not a good idea. It is some kind of anti-pattern as those immutable objects referring to the original state. Hence if you convert those Immutable types into JS objects in the component then it means you can mutate the state from component which is obviously not a good thing.

ImmutableJS map to javascript object

1 Answers1