Clean Code Example

clean-code.js

(function () {
  var articleImage = document.querySelectorAll('.article img'),
    nextArrow = document.getElementById('#nextArrow'),
    previousArrow = document.getElementById('prevArrow');
  
  articleImage.addEventListener('click', openGallery);
  nextArrow.addEventListener('click', showNextImage)
  previousArrow.addEventListener('click', showPreviousImage)
  
  function openGallery() {
    //...
  }
  
  function showNextImage() {
    //...
    
  }
  
  function showPreviousImage() {
    //...
  }
  
  
  
})();

not-clean-code.js

function(i, a, t, e, r) {
        var l, n = this,
            o = function(l) {
                l.onload = null
                var o = l.width,
                    s = l.height
                if (r) {
                    var d = o / a,
                        c = s / t,
                        h = Math.min(d, c)
                    s = Math.min(s, parseInt(s / h)), o = Math.min(o, parseInt(o / h))
                } else o > a && (s /= o / a, o = a), s > t && (o /= s / t, s = t)
                s = parseInt(s), o = parseInt(o), i.css({
                    height: s,
                    width: o
                }), i.hasClass("lzyPlcHld") || i.attr("src", i.attr("data-src")).removeAttr("data-src"), n.log("loaded: " + i.attr("src") + " (" + o + "x" + s + ")" + (r ? " + crop" : "")), "function" == typeof e && e(i)
            },
            s = i.attr("data-src")
        void 0 !== n.lazyLoadCache[s] ? (l = {
            width: n.lazyLoadCache[s].width,
            height: n.lazyLoadCache[s].height
        }, n.log("loaded: using cache"), o(l)) : (l = new Image, l.onload = function() {
            n.lazyLoadCache[s] = {
                width: l.width,
                height: l.height
            }, o(l)
        }, l.src = i.attr("data-src"))
    }