closure test

Simple test showing how variables inside closure get captured in the scope

by Aras Balali Moghaddam

HTML

<div id="box">M</div>

CSS

#box {
    font-size: 32px;
    position: relative;
    background-color: orange;
    padding: 2rem;
    width: 2rem;
    border-radius: 3em;
}

JavaScript

function animateIt(elementId) {
    var e = document.getElementById(elementId);
    
    var timer = setInterval(function() {
        if(tick < 200) {
            e.style.left = e.style.top = tick + 'px';
            tick++;
        } else {
            clearInterval(timer);
            console.log("timer is defined: " + !!timer);
            console.log("e is defined: " + !!e);
            console.log("tick is defined: " + tick);
        }
    }, 10);
    
    var tick = 0;
}

animateIt("box");