monocle-decorators
Tiny library with most common/useful decorators. Think of it as underscore.js, but with class.
Table of contents
- Decorators for classes
- Decorators for instance methods/properties
Installation
npm install monocle-decorators --save
Decorators for classes
@_o.mixin
Extends decorated class with all enumerable properties from ArrayOfMixins
passed as argument.
💡 Tip
Prefer composability over inheritance.
@_o.mixin(ArrayOfMixins)
As decorator { const speed = 5 thisdistanceFromOrigin += speed } { const speed = 10 thisdistanceFromOrigin += speed } @_o { thisdistanceFromOrigin = 0 } const foo = foo // method from Walkable classfoo // method from Runnable classfoodistanceFromOrigin // => 15
💡 Tip
Array of mixins can also be an array of objects, if you don't feel classy.
const walkable = { const speed = 5 thisdistanceFromOrigin += speed } const runnable = { const speed = 10 thisdistanceFromOrigin += speed } @_o { thisdistanceFromOrigin = 0 } const foo = foo // method from Walkable classfoo // method from Runnable classfoodistanceFromOrigin // => 15
_o.mixin(TargetClass, ArrayOfMixins)
As function _o const foo = foo // method from Walkable classfoo // method from Runnable classfoodistanceFromOrigin // => 15
@_o.freeze
Freezes every new instance of decorated class.
A frozen object prevents:
- new properties from being added to it
- existing properties from being removed
- existing properties, or their enumerability, configurability, or writability, from being changed
💡 Tip
@_o.seal
and@_o.freeze
makes it easier to work with objects, since you have to declare beforehand all properties and methods an object has and will have in it's lifecycle, concentrating in one single place the definition of the object structure.
@_o.freeze
As decorator @_ofreeze { thisa = 1 thisb = 2 } const foo = fooc = 3 // throws Error
_o.freeze(TargetClass)
As function const DummyFrozen = _oconst foo = fooc = 3 // throws Error
@_o.seal
Seals every new instance of decorated class.
A sealed object prevents:
- new properties from being added to it
- marking all existing properties as non-configurable
Values of present properties can still be changed as long as they are writable.
💡 Tip
@_o.seal
and@_o.freeze
makes it easier to work with objects, since you have to declare beforehand all properties and methods an object has and will have in it's lifecycle, concentrating in one single place the definition of the object structure.
@_o.seal
As decorator @_oseal { thisa = 1 thisb = 2 } const foo = fooc = 3 // throws Error
_o.freeze(TargetClass)
As function const DummySealed = _ofooc = 3 // throws Error
Decorators for instance methods/properties
@_o.bind
Autobind the decorated method to it's owner, so this
will always refer to the
object that owns the method.
💡 Tip
This decorator avoids the verbose
<button onClick={this.handleClick.bind(this)}></button>
idiom, using only<button onClick={this.handleClick}></button>
.
@_o.bind
As decorator @_obind { // ... } { return <div onClick=thishandleClick>Lorem ipsum</div> }
_o.bind(targetMethod, context)
As function const obj = { // ... } _o element
@_o.debounce
Debounces decorated method, which will postpone its execution until after
wait
milliseconds have elapsed since the last time it was invoked.
💡 Tip
Useful for implementing behavior that should only happen after the input has stopped arriving. For example: rendering a preview of a Markdown comment, recalculating a layout after the window has stopped being resized, and so on.
@_o.debounce(wait)
As decorator @_o { // ... }
_o.debounce(targetMethod, wait)
As function const onScroll = _o
@_o.throttle
Throttles decorated method, that, when invoked repeatedly, will only actually
call the original function at most once per every wait
milliseconds.
💡 Tip
Useful for rate-limiting events that occur faster than you can keep up with.
@_o.throttle(wait)
As decorator @_o { // ... }
💡 Tip
To have the same behavior as a hypothetical
@_o.once
, use@_o.throttle(Infinity)
.
_o.throttle(targetMethod, wait)
As function const onScroll = _o
@_o.deprecate
Calls opts.logger
with msg
as depreciation message.
By default opts.logger
is console.warn
and msg
is ${target.constructor.name}.${key} is deprecated.
. Both are optional.
@_o.deprecate(msg, { logger })
As decorator { // ... } @_o { // ... }
_o.deprecate(target, key, msg, { logger })
As function const dummy = _o
Why monocle?
Because you import it as _o
and use it as @_o
.
Classy decorators.
Reference
- Icon by Ben Iconator from The Noun Prokect
Sponsor
If you found this library useful and are willing to donate, consider
transferring some bitcoins to 1BqqKiZA8Tq43CdukdBEwCdDD42jxuX9UY
.
caiogondim.com · GitHub @caiogondim · Twitter @caio_gondim