Search code examples
javascriptreactjsdesign-patternsreduxstore

What is the pattern of extending createStore of Redux with enhancers?


While writing a blog post about decoupling Redux state from components, I have noticed the usage of enhancer used in createStore link:

export default function createStore(reducer, preloadedState, enhancer) {
  /* .... */
  if (typeof enhancer !== 'undefined') {
    if (typeof enhancer !== 'function') {
      throw new Error('Expected the enhancer to be a function.')
    }

    return enhancer(createStore)(reducer, preloadedState)
  }
  /* ... */
  return store;
}

The generic pattern, accordingly, is:

function func(arg1, /* ... */, argN, enhancer) {
  /* .... */
  if (typeof enhancer === 'function') {    
    return enhancer(func)(arg1, /* ... */, argN);
  }
  /* ... */
  return result;
}

I was excited about this. Now I am wondering how would you classify / name it, and whether it is an ad-hoc excellent piece of code or a result of some systematic approach that is part of something bigger that I'd like to learn and start to apply.


Solution

  • I think you would call this a Decorator.