闭包实现计数器

具体原理

设置全局变量计数器为 0,add 指定了函数自我调用的返回字值,自我调用函数只执行一次,并返回函数表达式。

add变量作为一个函数使用,可以访问函数上一层作用域的计数器。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>

<p>局部变量计数。</p>
<button type="button" onclick="addFunction()">+</button>
<button type="button" onclick="deleteFunction()">-</button>
<p id="demo">0</p>
<script>
var counter = 0;
var add = (function () {
    return function () {
    	return counter += 1;
    }
})();
var dele = (function(){
	return function(){
		return counter -= 1;
	}
})();
function addFunction (){
	document.getElementById('demo').innerHTML = add();
}
function deleteFunction(){
	document.getElementById('demo').innerHTML = dele();
}
</script>

</body>
</html>

闭包实现计数器_第1张图片

闭包是一种保护私有变量的机制,在函数执行时形成私有的作用域,保护里面的私有变量不受外界干扰。

直观的说就是形成一个不销毁的栈环境。

参考:菜鸟教程

你可能感兴趣的:(js)