Created
March 29, 2015 15:02
-
-
Save bharathmuppa/9815d9c2023741b469c0 to your computer and use it in GitHub Desktop.
JS Bin closure and self invoking example // source http://jsbin.com/pakiqi
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta name="description" content="closure and self invoking example"> | |
<meta charset="utf-8"> | |
<title>JS Bin</title> | |
</head> | |
<body> | |
<button id="button">button</button> | |
<script id="jsbin-javascript"> | |
// self-invoking a function literal and assigning the value of the invocation to the variable myQuery. | |
var myQuery = (function() { | |
return "Hello"; | |
})(); | |
// self-invoking a function literal and assigning the value of the invocation to the variable myQuery. | |
var myQuery1 = (function() { | |
return "Hello"; | |
}); | |
var value = myQuery1(); | |
// on button third click alert should be displayed | |
var element = document.getElementById("button"); | |
element.onclick = (function() { | |
// init the count to 0 | |
var count = 0; | |
return function(e) { | |
//count | |
count++; | |
if (count === 3) { | |
// do something every third time | |
alert("Third time's the charm!"); | |
//reset counter | |
count = 0; | |
} | |
}; | |
})(); | |
//withot closure | |
/*var counter = 0; | |
var element = document.getElementById("button"); | |
element.onclick = function() { | |
// increment outside counter | |
counter++; | |
if (counter === 3) { | |
// do something every third time | |
alert("Third time's the charm!"); | |
// reset counter | |
counter = 0; | |
} | |
};*/ | |
//sample closure | |
function add(value1) { | |
return function doAdd(value2) { | |
return value1 + value2; | |
}; | |
} | |
var increment = add(1); | |
var foo = increment(2); | |
</script> | |
<script id="jsbin-source-javascript" type="text/javascript">// self-invoking a function literal and assigning the value of the invocation to the variable myQuery. | |
var myQuery = (function() { | |
return "Hello"; | |
})(); | |
// self-invoking a function literal and assigning the value of the invocation to the variable myQuery. | |
var myQuery1 = (function() { | |
return "Hello"; | |
}); | |
var value = myQuery1(); | |
// on button third click alert should be displayed | |
var element = document.getElementById("button"); | |
element.onclick = (function() { | |
// init the count to 0 | |
var count = 0; | |
return function(e) { | |
//count | |
count++; | |
if (count === 3) { | |
// do something every third time | |
alert("Third time's the charm!"); | |
//reset counter | |
count = 0; | |
} | |
}; | |
})(); | |
//withot closure | |
/*var counter = 0; | |
var element = document.getElementById("button"); | |
element.onclick = function() { | |
// increment outside counter | |
counter++; | |
if (counter === 3) { | |
// do something every third time | |
alert("Third time's the charm!"); | |
// reset counter | |
counter = 0; | |
} | |
};*/ | |
//sample closure | |
function add(value1) { | |
return function doAdd(value2) { | |
return value1 + value2; | |
}; | |
} | |
var increment = add(1); | |
var foo = increment(2); | |
</script></body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// self-invoking a function literal and assigning the value of the invocation to the variable myQuery. | |
var myQuery = (function() { | |
return "Hello"; | |
})(); | |
// self-invoking a function literal and assigning the value of the invocation to the variable myQuery. | |
var myQuery1 = (function() { | |
return "Hello"; | |
}); | |
var value = myQuery1(); | |
// on button third click alert should be displayed | |
var element = document.getElementById("button"); | |
element.onclick = (function() { | |
// init the count to 0 | |
var count = 0; | |
return function(e) { | |
//count | |
count++; | |
if (count === 3) { | |
// do something every third time | |
alert("Third time's the charm!"); | |
//reset counter | |
count = 0; | |
} | |
}; | |
})(); | |
//withot closure | |
/*var counter = 0; | |
var element = document.getElementById("button"); | |
element.onclick = function() { | |
// increment outside counter | |
counter++; | |
if (counter === 3) { | |
// do something every third time | |
alert("Third time's the charm!"); | |
// reset counter | |
counter = 0; | |
} | |
};*/ | |
//sample closure | |
function add(value1) { | |
return function doAdd(value2) { | |
return value1 + value2; | |
}; | |
} | |
var increment = add(1); | |
var foo = increment(2); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment