Skip to content Skip to sidebar Skip to footer

Curried Function Where Es7 Property Initializers Aren't Enabled

I have the following arrow function in a so called curried format, taken from this SO answer: const getIntervals = n=> availability=> {} I need to use it in a React componen

Solution 1:

Just define getIntervals as a regular method, but have it return your curried function:

classExampleextendsComponent {
   getIntervals(n) {
      return(availability) => {

      }
   }
   render() {...}
}

Solution 2:

Cool to see my work referenced in another question. I'm happy it's working out for you.

@RobM has provided a (per usual) good answer for you but I'll give you another option.


First, it's not necessary for you to keep the function in curried format. Since this is a user-defined procedure, if it serves you better to have it take a tuple, you can make it so ! Converting it is as easy as … †

// curried formconstgetIntervals = n=> availability=> { ... }

// uncurried formconstgetIntervals = (n,availability)=> { ... }

Then when you call it

// curried form
getIntervals (30) (availability)

// changes togetIntervals(30, availability)

I generally define functions in curried form, but it is by no means a requirement you must follow. In uncurried form, you could define it directly on your React component like so …

class Example extends Component
  getIntervals(n,availability){
    // ...
  }
}

Or because getIntervals is a generic and pure function, there's no reason to embed all of its code inside the component. You can just as easily leave it totally separate

// curriedconstgetIntervals = n=> availability=> { ... }

// or choose uncurriedconstgetIntervals = (n,availability)=> { ... }

// call it from withint the classclassExampleextendsComponent
  getIntervals (availability) {
    return getIntervals (this.props.intervalLength, availability)
  }
}

Or, now you might see how useless it is to have a wrapper function at all. It's more likely that the return value is going to be used in some other way, like in an event handler or some state mutation …

constgetIntervals = (n,availability) => { ... }

classExampleextendsComponent {
  // constructor ...
  onclick (event) {
    let intervals = getIntervals(this.props.intervalLength, this.state.availability)
    // do something with intervalsconsole.log(intervals)
  }
  render () {
    return<buttononClick={e=> onclick(e)}>show intervals</button>
  }    
}

Now getIntervals can leave this file altogether if you want. You could drop it in utils.js and import it

import {getIntervals} from'./utils'classExampleextendsComponent {
  onclick (event) {
    let intervals = getIntervals(this.props.intervalLength, this.state.availability)
     // ...
  }
  // ...
}

I use this.props.intervalLength and this.state.availability as examples. I don't actually know how these two values are associated with the component. I leave that up to you ^_^


† conversion from curried to uncurried procedure is generally simple, but you have to be careful in the event the curried procedure is a recursive one — in which case, you'd also have to update the recursive call to be in uncurried form as well.

I leave this as a footnote because I wrote getIntervals and conversion is simple in this particular scenario

Post a Comment for "Curried Function Where Es7 Property Initializers Aren't Enabled"