This block provides an object with a set of methods for working with JavaScript functions.
Name | Type or return value | Description |
---|---|---|
isFunction(obj {*} ) |
Boolean |
Checks whether a passed argument is a function. |
noop | Function |
Empty function. |
Element | Usage | Description |
---|---|---|
debounce | JS |
Function decorator that combines multiple function calls within a specified time period into one call. |
throttle | JS |
Function decorator that limits the frequency of function execution to once per specified period. |
The block is implemented in:
vanilla.js
isFunction
methodChecks whether a passed argument is a function.
Accepted arguments:
obj {*}
– The object being checked. Required argument.Return value: Boolean
. If the argument is a function, then true
.
modules.require('functions', function(func) {
var a = function(){},
b = {};
console.log(func.isFunction(a)); //true
console.log(func.isFunction(b)); //false
});
noop
propertyEmpty function (function() {}
).
No arguments or return value.
You can use noop
when you need a function but there isn't a reason to add the logic. For example, you can use it as a placeholder for base classes at the design stage when using OOP.
Example:
modules.define('base-class', ['inherit', 'functions'], function(provide, inherit, functions) {
provide(inherit({
getData : function() {
this._sendRequest();
},
_sendRequest : functions.noop
}));
});
The block elements implement a set of function decorators.
The decorators add logic to the function without changing its original signature.
debounce
elementA decorator that postpones function calls for the specified delay time. After each attempt to make a call, the delay starts over again.
Accepted arguments:
fn {Function}
— Original function. Required argument.timeout {Number}
— Time of delay, in milliseconds. Required argument.invokeAsap {Boolean}
] — The debounce
mode. By default, the first mode is used (corresponding to the false
value).context {Object}
] — The context for executing the original function.There are two debounce
modes, depending on the value of invokeAsap
:
Return value: Function
. The decorated function.
Example:
modules.require('functions__debounce', function(provide, debounce) {
function log() {
console.log('hello!');
}
var debouncedLog = debounce(log, 300);
setInterval(debouncedLog, 50);
});
throttle
elementThis decorator allows you to "slow down" the function. It won't be executed more than once during the specified period, no matter how many times it is called during this time. All calls in the meantime are ignored.
Accepted arguments:
fn {Function}
— Original function. Required argument.period {Number}
— The interval between calls, in milliseconds. Required argument.context {Object}
] — The context for executing the original function.Return value: Function
. The decorated function.
This method is convenient for setting resource-intensive handlers for frequently generated events, such as resize
, pointermove
, and so on.
Example:
modules.require('functions__throttle', function(provide, throttle) {
function log() {
console.log('hello!');
}
var throttledLog = throttle(log, 300);
setInterval(throttledLog, 50);
});
As a result, the function is executed no more than once every 300 milliseconds.