本文解析如何利用JavaScript闭包特性,将连续执行的代码拆分为多个阶段。通过外层函数返回内层函数,保存中间状态变量,实现点击按钮后继续执行后续逻辑的效果。文章通过基础示例、函数传参及嵌套函数三种场景,详细演示了闭包在控制程序执行流中的实际应用。
作者:月影
来源:http://bbs.51js.com/thread-66361-1-1.html
<input type="button" value="继续" onclick='st();'/>
闭包基本原理:立即执行函数与状态保存
<script>
/*基本原理*/
var st = (function(){
alert(1);
alert(2);
return function()
{
alert(3);
alert(4);
}
})();
</script>
<input type="button" value="继续" onclick='st();'/>
函数传参:利用闭包保持变量状态
<script>
/*函数*/
function test(x)
{
alert(x++);
alert(x++);
return function()
{
alert(x++);
alert(x++);
}
}
var st = test(10);
</script>
<input type="button" value="继续" onclick='st();'/>
复杂场景:函数嵌套与多层闭包应用
<script>
/*函数嵌套*/
function a(x,y)
{
var st2 = b(x+y);
return function()
{
st2 = st2();
alert(st2);
}
}
function b(a)
{
alert(a++);
alert(a++);
return function()
{
alert(a++);
alert(a++);
return a;
}
}
var st = a(10,20);
</script>