Page:
UTILITIES
Pages
A-Z
CSS Classes & Styles
DATA Utilities (Arrays)
DATA Utilities (Objects)
DOM Attributes
DOM Content
DOM Manipulation
DOM States
DOM Traversal
EFFECTS Fade
EFFECTS Slide (horizontal)
EFFECTS Slide (vertical)
EVENTS Bindings
EVENTS Form
EVENTS Keyboard
EVENTS Lifecycle
EVENTS Mouse
EVENTS Touch
HTTP Requests
Home
Installation
Quick Start
The Frankenstein Chain
UTILITIES
No results
1
UTILITIES
Sven Minio edited this page 2026-05-17 20:02:47 +02:00
Table of Contents
$.each
Description A generic, highly performant iterator function that can be used to seamlessly iterate over both arrays (or array-like objects such as NodeLists) and plain objects.
Unlike the native Array.prototype.forEach(), $.each() allows you to break the loop early by returning false within the callback function, saving valuable CPU cycles.
Parameters
collection(Array | Object | NodeList): The collection to iterate over.callback(Function): The function to execute for each item.- For arrays, the callback is passed
(index, value). - For objects, the callback is passed
(key, value). - The
thiscontext inside the callback refers to the current value.
- For arrays, the callback is passed
Returns
- (Array | Object): The original collection.
Examples
// 1. Iterating over an Array (with early break)
const fruits = ['Apple', 'Banana', 'Cherry', 'Date'];
$.each(fruits, function(index, value) {
console.log(index + ': ' + value);
// Stop the loop completely once we find 'Cherry'
if (value === 'Cherry') {
return false;
}
});
// 2. Iterating over an Object
const user = { id: 1, name: 'Alice', role: 'Admin' };
$.each(user, function(key, value) {
console.log(key + ' = ' + value);
});
// 3. Iterating over a NodeList directly
const buttons = document.querySelectorAll('button');
$.each(buttons, function(index, btn) {
btn.classList.add('processed');
});
$.throttle
Description
Ensures a function is called at most once in a specified time limit. [cite_start]Perfect for scroll or resize events. [cite: 561]
Parameters
func(Function): The function to throttle.- [cite_start]
limit(Number): The time limit in milliseconds. [cite: 561]
Example
const throttledScroll = $.throttle(() => {
console.log('Scrolling...');
}, 200);
$(window).on('scroll', throttledScroll);
$.debounce
Description Delays the execution of a function until after a specified wait time has passed since the last time it was invoked. [cite_start]Ideal for search inputs. [cite: 565]
Parameters
func(Function): The function to debounce.- [cite_start]
delay(Number): The delay in milliseconds. [cite: 565]
Example
const search = $.debounce((query) => {
$.http.get('/search?q=' + query).then(console.log);
}, 500);
$('#search-input').on('input', function() {
search($(this).val());
});