define-args
define-args lets you bind arguments to a function to create another function
of smaller arity.
It is similar to bind
, with the exception that args
will not bind context.
Browser Usage
Add define-args to your document:
<script src="https://unpkg.com/define-args"></script>
Alternatively, import the browser module script:
import defineArgs from 'https://unpkg.com/define-args/browser.mjs'
Use define-args to enable args()
on any function:
<script>
var addTwoNumbers = defineArgs(function (a, b) { return a + b })
addTwoNumbers(2, 3)
var addOneNumber = defineArgs(addTwoNumbers).args(1)
addOneNumber(2, 3)
</script>
Use define-args to extend classes:
<script>
var StoredNumber = defineArgs(function (number) { this.number = number })
var someStoredNumber = new StoredNumber(5)
var StoredOne = StoredNumber.args(1)
var anotherStoredNumber = new SomeOneNumber(5)
SomeNumber.prototype.and = function (number) { return this.number + number }
someStoredNumber.and(5)
anotherStoredNumber.and(5)
</script>
The browser script works in all modern browsers, including Internet Explorer 9+.
Node Usage
Add define-args to your project:
Use define-args to extend functions:
const defineArgs = require('define-args')
Alternatively, import the module script:
import defineArgs from 'define-args'
Both Node scripts work in Node 8+.
Example Usage: React Component
import defineArgs from 'https://unpkg.com/define-args/browser.mjs'
function BoundComponent () {
const { constructor } = this
Object.getOwnPropertyNames(constructor.prototype).forEach(
name => this[name] !== constructor && typeof this[name] === 'function'
? this[name] = defineArgs(this[name].bind(this))
: null
)
} BoundComponent.prototype.isReactComponent = {}
class MyComponent extends BoundComponent {
constructor () {
super()
this.state.items = [
'Defeat Bowser',
'Save the Princess'
]
}
remove (index) {
const prevItems = this.state.items
const nextItems = prevItems.slice().splice(index, 1)
this.setState({ items: nextItems })
}
render () {
return (
<ul>
this.state.items.map(
(item, index) => (
<li key={index}>
<span>{item}</span>
<button onClick={this.remove.args(index)}>remove</button>
</li>
)
)
</ul>
)
}
}