Profile photo of Travis Horn Travis Horn

JavaScript Reference: Closures

2016-08-03
JavaScript Reference: Closures

This post is part of a project to move my old reference material to my blog. Before 2012, when I accessed the same pieces of code or general information multiple times, I would write a quick HTML page for my own reference and put it on a personal site. Later, I published these pages online. Some of the pages still get used and now I want to make them available on my blog.

Emulating Private Methods

// Create single environment with 3 functions
var makeCounter = function() {
  // Private variable and private function
  var privateCounter = 0;
  function changeBy(val) {
    privateCounter += val;
  }
  return {
    increment: function() {
      changeBy(1);
    },
    decrement: function() {
      changeBy(-1);
    },
    value: function() {
      return privateCounter;
    }
  }   
};


// Create closure from function
counter = makeCounter();

// Use functions of closure
document.write(counter.value() + "<br>");

counter.increment();
counter.increment();

document.write(counter.value() + "<br>");

counter.decrement();

document.write(counter.value());

Multiple Closures

// Create the function
function makeLevelAdder(level){
  return function(schoolName) {
    return schoolName + " " + level;
  };
}

// Create the closures
var addElementary = makeLevelAdder("Elementary");
var addMiddle = makeLevelAdder("Middle");

// Print to screen using closures
document.write(addElementary("Lincoln") + "<br>");
document.write(addMiddle("Washington"));

Simple Example

// Create a function
function func() {
  var districtName = "Central School District";
  function displayName() {
    document.write(districtName);
  }
  displayName();
}

// Put the function in a closure and call it.
var closure = func();
closure();

Cover photo by Todd Diemer.

Here are some more articles you might like: