JavaScript的三种代码书写格式

 
在这里我将 JavaScript 的类与 Java(本人主要是做Java开发的) 的类做一个比较,以便大家能够更好的理解。
 
1. 在没有接触 JS 的面向对象编程之前,写JS的函数都是像下面这样写的:
function test(){
    var v1 = "test";
    var v2 = "value";
    if(v1=="test"){
        v2 = v1;
    }
}
在上面这个 test() 函数里面的变量 v1v2 其实我们可以看成是 Java 里面的全局静态常量, 写在 test() 里的一些代码和
逻程相当于 Java 里面的静态代码块, 所以我们在 html 或者jsp里面调用 test() 函数可以直接写调用, 而不用去初使化,因为
静态常量 和 静态代码块是可以直接通过类名调用的。例如 :<input type="button" onclick="test()" >
 
2. 如果我们要将去封装一个JavaScript 的类库, 并在类库中提供相应的方法,该如何去写呢? 如下:
function KTools(){}
 
KTools.prototype = {
    //去除首尾空格
    trim : function(str){
        return str.replace(/(^\s+)|(\s+$)/g"");
    },
 
    //去除全部空格    
    trimAll : function(str){
        return str.replace(/\s+/g"");
    }
 
};
这里的 KTools 类,如果我们在 html 里进行调用的话,直接通过类名去调用 trim() 方法的话,是调用不到的,
我们必须先 new KTools() 的对象,例如:<input type="button" onclick="new KTools().trim('sss ssss')" >
如果在 trim() 方法里面定义一个变量,就属于是局部变量了。
通过和 Java 对比我们发现,其实JavaScript 和 Java 还有不少相似之处!
 
3. 除了上面这两种JS代码块的书写格式,我还用过第三种书写格式,如下:
var DT = {
 
    //模块加载
    moduleLoad : function(){
          DT.menuLoad(null);
    },    
    //列表加载
    listLoad : function(){
        .........
    },
 
    //菜单加载
    menuLoad : function(json){
        ..........
    },
    //评论加载
    commentLoad : function(){
        .........
    }
};
这种格式书写的代码,在 html 中调用是 变量名[DT].方法名[menuLoad](),例如:<input type="button" onclick="DT.listLoad();" > 
在这里,方法之间也可以相互调用。  通过这种格式书写出来的代码,调用起来也比较方便,代码的层次结构也比较清晰!
在使用的过程中,可以选择一种更适合自己的格式去书写 JS 代码!
 

整理背景:港交行[2012-11-29]

 





原文地址:https://www.cnblogs.com/cookray/p/2794891.html