您的位置：首页 > Web前端 > JavaScript

js好习惯

2016-06-30 09:39 381 查看

1、当命名全局js变量时,用var 声明,避免用 object=1; 这个的形式；当声明一个全局方法的时候也应该var fun=function (){};这个形式,避免使用function fun(){};这样的形式,因为这个声明会影响方法的声明顺序;

2、当一个html页面包含多个js的时候，有时候会导致方法覆盖,这个如何解释呢，就比如有a.js里面声明了 var fun=function(){ alert(“1”);}; b.js里面声明了var fun=function(){ alert(“2”);}; 当一个页面同时包含了a.js b.js的时候，当你潜意识想调用第二个fun();发现弹出了1;，就是因为第二个方法被覆盖了；如何避免这种情况呢,我们约定每个js的名字在web下面都是唯一的，然后在js文件里声明一个命名空间变量 var ns(具体的js文件名)={};然后这个js声明的所有方法和变量前面都要加上ns这个前缀，这个不同的命名空间下声明的方法和变量就不会冲突了，当调用时候要把前缀加上已区分调用哪个空间的命名空间下的东西

附上测试代码：

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js">
</script>

<script>

/* 注意:保证web中只有一个core.js 模拟script type="text/javascript" src="/core.js"></script*/
var core={};
core.$common=function (selector_str){
var sel_str=selector_str;
var JqueryObj=$(selector_str);
return {
panal:function(init){
var width=init.width!=null?init.width:100;
JqueryObj.width(width);
var height=init.height!=null?init.height:100;
JqueryObj.height(height);
if(init.css!=null)JqueryObj.css(init.css);
return this;
},
layout:function(init){

},
dialog:function(init){
}

}

}
</script>
<script>

/* 注意:保证web中只有一个one.js 模拟script type="text/javascript" src="/one.js"></script*/
var one={};
one.render=function (){
var init_={width:200,height:300};
init_.css={"background-color":"yellow","font-size":"200%"};
core.$common("#div").panal(init_).panal({width:300,height:300});
}
</script>
<body>
<div id="div">div</div>
<input type="button" onclick="one.render();" value="渲染div">
<input type="button"  onclick="" value="还原div">
</body>

</html>

本人菜鸟，文章有不对的地方请指出,本人虚心请教。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航