A simple counter application demonstrating JavaScript closure and scope concepts. The app allows users to increment, decrement, and reset a counter value while maintaining private state through closure.
- Increment and decrement counter value
- Reset counter to zero
- Value validation (range: -100 to 100)
- Private state management using closure
- Clean and responsive UI
The core functionality is built using JavaScript closure:
const counter = (function() {
// Private variable - only accessible within this scope
let count = 0;
// Public interface
return {
increment() {
count = validateCount(count + 1);
updateDisplay();
},
decrement() {
count = validateCount(count - 1);
updateDisplay();
},
reset() {
count = 0;
updateDisplay();
}
};
})();- Closure: Maintains private state (
count) between function calls - IIFE (Immediately Invoked Function Expression): Creates private scope
- Private Variables:
countis not accessible from outside - Public Methods: Only exposed through returned object
- HTML5
- CSS3
- JavaScript (ES6)
For more information about closures in JavaScript:
MIT License