【散分】你是如何隐藏你的变量和属性的
这段时间在javascript版块学习了很多,其中感触最深的就是对js继承和对变量的隐藏上。
我们都知道全局变量的危险性以及可能的与其他库或者js文件冲突问题,所以很多时候我们都在想办法去隐藏我们的全局变量,最简单的方法莫过于加入“命名空间”
- JScript code
var Lib = {};Lib.Do = {};...
把所有的内容都放到一个Lib里面。这样我们就可以不用为全局变量的污染而担忧了。
当然,说到js,就不得不提那强大的闭包,在这里我们也可以通过闭包来解决全局变量的污染。比如我们希望构造一个person对象,其对象中有name、age、sex3个属性。那么我们通常的做法是什么呢?
- JScript code
function Person(name,age,sex) { this.name = name || "jee"; this.age = age || 24; this.sex = sex || true}
这种模仿类的方法使从类对象语言如(C#、java、C++)等专业的童鞋来说非常的容易接受,我们可以加上属性的getter和setter
Person.prototype.getName = function() {
return this.name;
};
Person.prototype.setName = function(name) {
if (name) {
this.name = name;
}
}
现在我们理所当然的可以去创建一个对象
- JScript code
var p = new Person("jee",24,true);alert(p.getName());
然而,我们同样可以这样去获取name
- JScript code
alert(p.name);
这很糟糕,因为他暴露了我们的属性。通过闭包我们可以去解决这个问题,因为在js中,函数是可以被当作返回值返回的。
- JScript code
function person(name,age,sex) { var _name = name || "jee"; var _age = age || 24; var _sex = sex || true; return { getname : function() { return _name; }, setname : function(n) { _name = n; } getage : function() { return _age } ... };}
var p = person("jee",24,true);
这个时候你只能通过getname,setname...等方法来进行属性的存取了。
在这里我遇到过这样一个问题,在使用闭包时,内部的函数使用的是外包函数的实际变量而非copy。我们看这样的代码
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <script type="text/javascript"> window.onload = function() { var li = document.getElementsByTagName("li"); for (var i = 0; i < li.length; i++) { li[i].onclick = function() { alert(i); }; } };</script><style>li { width:100px; background-color:red; cursor:pointer; line-height:20px; margin-bottom:5px;}</style></head><body> <ul> <li></li> <li></li> <li></li> </ul></body></html>
点击每个li看看发生了什么,对,都是3.因为这是函数构造的时候绑定了i,而非是单纯的得到了i在绑定时的值。这个教训让 我深刻的认识到了这个问题。也在私下找了一些相关资料,现在我们可以把js段代码修改如下
- JScript code
window.onload = function() { var li = document.getElementsByTagName("li"); for (var i = 0; i < li.length; i++) { li[i].onclick = function(i) { return function() { alert(i); }; }(i);//i作为参数传递给这个自执行函数,在绑定onclick的时候,该函数已执行,而这个函数体内部调用的就是该i的值了 } };
在运行看看,好了,可以得到我们想要的结果了,这里勘误一下《javascript语言精粹》里第39页类似例子多了个e,大家把返回函数的参数e去掉就可以正确运行了。
因为这样修改后,onclick绑定的是一个自执行函数返回的一个函数,而这个函数绑定的是作为参数传递进来的i的值。
发这个是这段时间对该段内容的理解,由于不是很有把握,所以发在js的版块里算是抛砖引玉,希望各位大牛能够给小弟一些指导。在此谢过。
[解决办法]
匿名函数就行了
[解决办法]
学习,还是不太理解。
[解决办法]
我们都是这样隐藏的
- JScript code
(function() { var isIE = ....; function repaint() {} function redraw() {} function Chart() {} Chart.prototype = { repaint: repaint, redraw: redraw }; Rs = { version: 1.0, Chart: Chart };})();
[解决办法]
LZ的学习精神非常值得借鉴。。
顶起接分
[解决办法]
考虑到函数有自己的作用域,也可以这样实现:
- JScript code
... li[i].onclick = function() { this.value = i; alert(this.value); };
[解决办法]
纯接分
[解决办法]
顶起接分
[解决办法]
顶帖拿分
[解决办法]
hey,牛人我来膜拜你了,给分吧~
[解决办法]
hey,牛人我来膜拜你了,给分吧~
[解决办法]
这种讨论很有益,期待完整并进行过比较筛选的方法集合
[解决办法]
mark
[解决办法]
推荐精华贴
[解决办法]
我是直接new Function来搞,
- JScript code
window.onload = function() { var li = document.getElementsByTagName("li"); for (var i = 0; i < li.length; i++) { li[i].onclick =new Function("alert("+i.toString()+")"); } };
[解决办法]
膜拜你..........
[解决办法]
受教了
[解决办法]
学习了!
[解决办法]
看来我还是菜鸟。因为本人从不隐藏
[解决办法]
呵呵,当然要数句柄类了
很厉害
[解决办法]
学习啊,哈哈
顺便 JF
[解决办法]
我来看看
[解决办法]
拜读了,还没研究
[解决办法]
高手! 学习了!
[解决办法]
高手!看不太懂,但是学习了!
[解决办法]
学习
[解决办法]
回帖即可获得10分可用分!小技巧
[解决办法]
有必要隐藏吗???
[解决办法]
学习了
[解决办法]
~~~~~~~~jF
[解决办法]
接份,楼主散粉了。
[解决办法]
学习了,谢谢LZ分享
[解决办法]
好东西!!!!!!!!!
[解决办法]
为啥不用匿名函数呢?
[解决办法]
来学习,不懂
[解决办法]
讲的真好...
[解决办法]
额....我都不隐藏的.呵呵~学习.......
[解决办法]
学习学习JS.
[解决办法]
学习了。
[解决办法]
【散分】你是如何隐藏你的变量和属性的 [JavaScript]
[解决办法]
高手~~~~~~~~~~~~~~~~~~~~
[解决办法]
jf……
[解决办法]
帮顶,接分
[解决办法]
我还是新手只能学习
[解决办法]
学习学习
[解决办法]
学习了
[解决办法]
路过下~~~~~
[解决办法]
......................up..............................
[解决办法]
变量的使用域确实很重要,试一试this函数吧。
[解决办法]
学习啦,感谢!
[解决办法]
学习~!
[解决办法]
,学习了
[解决办法]
回帖 ,得分 ,押宝去。。。
[解决办法]
学习下~~~~~~~~~~~~~~~~~
[解决办法]
顶一下···
[解决办法]
学习了,看来高人还是不少啊
[解决办法]
不错 学习了
[解决办法]
[解决办法]
学习一下
[解决办法]
..........
[解决办法]
学习!!过路的!
[解决办法]
深度..学习
[解决办法]
学习。。。。
[解决办法]
每天回帖即可获得10分可用分!
[解决办法]
每天回帖即可获得10分可用分!
[解决办法]
- JScript code
Person.prototype.getName = function() { return this.name;};Person.prototype.setName = function(name) { if (name) { this.name = name; }}
[解决办法]
好东西,赚分
[解决办法]
好东西,赚分
[解决办法]
学习啊,哈哈
[解决办法]
学习了········
[解决办法]
泰丰证件.QQ996702552手机18757550100.www.0571banzheng.net
[解决办法]
接分来了!
[解决办法]
好帖,mark
[解决办法]
学习,还是不太理解。
[解决办法]
学习,还是不太理解。
[解决办法]
(function() {
var isIE = ....;
function repaint() {}
function redraw() {}
function Chart() {}
Chart.prototype = {
repaint: repaint,
redraw: redraw
};
Rs = {
version: 1.0,
Chart: Chart
};
})();
[解决办法]
是想学js但是感觉它太麻烦了
[解决办法]
好文,mark
[解决办法]
[解决办法]
学习“我得分的问题” 精华版——顺便散分,呵呵C++ Builder / 基础类- CSDN ... VB.net与C#哪个比较好?技术、性能及发展前景!(高分呀!) .NET技术 ... 散分200----谈谈c#论坛的结帖率问题.NET技术/ C# - CSDN社区community ... 如何用隐藏域来实现session的功能呢?以使页面长期有效? 【转】【Perl 文档中文化计划】Perl 特殊变量翻译完成。 - 其他开发语言/ 脚 ... [Python]阶乘运算之Python
[解决办法]
是不是平
[解决办法]
纯属路过。。。
[解决办法]
路过,酱油
[解决办法]
JS很强大....
[解决办法]
顶帖拿分
[解决办法]
学习!!
[解决办法]
纯接分
------解决方案--------------------
mark.....
[解决办法]
[解决办法]
又一经典的总结,值得学习!
[解决办法]
而且
// lz的代码
var p = person("jee",24,true);
// false
alert(p instanceof person);
// ls的代码
var person = new Person();
// true
alert(person instanceof Person);
哎。。。。我啥也不说了。。。
[解决办法]
学习了
[解决办法]
很像js框架里面的代码呀
不过框架一般都是这个格式
(function(){})()
不知道是什么意思,可否给我解释下
[解决办法]
路过,学习了。感谢LZ
[解决办法]
不是很明白,看看再说
[解决办法]
不是很明白,再看看。。。