javascript基础（闭包）

最新推荐文章于 2025-09-06 08:01:57 发布

weixin_34273046

最新推荐文章于 2025-09-06 08:01:57 发布

阅读量48

点赞数

CC 4.0 BY-SA版权

文章标签： javascript json ui ViewUI

原文链接：https://my.oschina.net/keejun/blog/126855

本文通过四个具体的示例介绍了JavaScript中闭包的应用场景，包括获取内部变量值、UI初始化、缓存数据及数据封装对象等，有助于理解闭包概念及其在实际开发中的作用。

为什么80%的码农都做不了架构师？>>>

//获取内部变量的值  f2为闭包  
function f1(){  
    var n = 999;  
    function f2(){  
        return n;  
    }  
    return f2;  
}  
var result = f1();  
alert(result());  
  
//闭包用途  UI初始化  
var datamodel = {  
    table : [],  
    tree : {}  
};  
(function(dm){  
    for(var i=0;i<dm.table.rows; i++){  
        var row = dm.table.rows[i];  
        for(var j=0;j<row.cells; j++){  
            drawCell(i,j);  
        }  
    }  
})(datamodel);  
//们创建了一个匿名的函数，并立即执行它，由于外部无法引用它内部的变量  
//执行完后很快就会被释放，关键是这种机制不会污染全局对象  
  
//闭包用途  缓存数据  
var CachedSearchBox = (function(){  
    var cache = {};  
    return{  
        attachSearchBox : function(dsid){  
            if (dsid in cache){//如果结果在缓存中  
                alert("获取缓存中的值");  
                return cache[dsid];  
            }  
            alert("新建的值");  
            var fsb = new Array("one","two","11","14","13","11","13","12");//新建  
            cache[dsid] = fsb;//更新缓存  
            return fsb;  
        },  
          
        clearSearchBox : function(dsid){  
            if( dsid in cache){  
                delete cache[dsid];  
            }  
        }  
    };  
})();  
alert(CachedSearchBox.attachSearchBox("input1"));//新建的值  
alert(CachedSearchBox.attachSearchBox("input1"));//获取缓存中的值  
CachedSearchBox.clearSearchBox("input1");//清除  
alert(CachedSearchBox.attachSearchBox("input1"));//新建的值  
alert(CachedSearchBox.attachSearchBox("input1"));//获取缓存中的值

// 闭包用途  数据封装  对象  
function Person(){  
    var names = "default";  
    return {  
        getName : function(){  
            return names;  
        },  
        setName : function(newname){  
            names = newname;  
        }  
    }  
};  
//alert(names); 直接报错 names 未定义  
var json = Person(); alert(json.getName());//default  
json.setName("json"); alert(json.getName());//json

转载于:https://my.oschina.net/keejun/blog/126855