How to ignore the order of reselecting selectors when compiling selectors

Question

As I collect more selectors together, I find myself reordering where the selectors are defined. For instance,

export const selectNav = state => state.nav;
export const selectPage = state => state.page;

export const selectNavAndPage = createSelector([
    selectNav,
    selectPage,
], (nav, page) => {

});

export const selectFoo = state => state.foo;

export const selectNavAndPageAndFoo = createSelector([
    selectNavAndPage,
    selectFoo,
], (navAndPage, foo) => {

});

This is a simple example, but I could not define selectNavAndPage below selectNavAndPageAndFoo. As more selectors form and selectors select form, then I need to make sure that all the selectors are defined on top before I use them.

Is there a way to create these selectors so that ordering doesn't matter?

Answer 1

, npm define-selectors. , . , , .

github README .

Answer 2

, , ES6 const. const , , const, . var .

, var, const .

Answer 3

, , cms, createSelector :

import {createSelector} from 'reselect';

// create memoized selector
function cms(ctx, ...args) {
    if (!ctx.selector) ctx.selector = createSelector(...args);
    return ctx.selector;
}

// define the selectors out of order...

export function getBaz(state) {
    return cms(
        getBaz  // the function itself as context
        , getBar
        , bar => bar.baz
    )(state);
}

export function getBar(state) {
    return cms(
        getBar
        , getFoo
        , foo => foo.bar
    )(state);
}

export function getFoo(state) {
    return state.foo;
}

, , , , - .