养成良好的编码习惯,提高代码的可维护性

  • 避免定义全局变量或函数

定义全局的变量和函数,会影响代码的可维护性。如果在页面中运行的javascript 代码是在相同的作用域里面,那就可能代码之间存在互相影响的可能性。

有很多种手段可以解决因为定义了全局变量而导致代码"污染"的问题。

1.最简单的方法是把变量和方法封装在一个变量对象上,使其变成对象的属性。例如:

var myTes={

length:0'

init:function(){...},

action:function(){...}

}

2.另一种改进的方案是把全局的变量包含在一个局部作用域中,然后在这个作用域中完成这些变量的定义以及变量使用的逻辑。例如,可以通过定义一个匿名函数实现:

(function()

{

var length=0;

function init(){...}

function action(){...}

})()

所有的逻辑都包含在了这个立即执行的匿名函数中,形成了一个独立的模块,最大限度的防止了代码之间的"污染"。当然,在实际的业务中,模块之间会有交互,这时可使用return语句,返回需要公开的接口。

var myDocument=(function()

{

var length=0;

function init(){...}

function action(){...}

return {

init:init

}

})();

外部代码访问init()方法时,就可以调用myDocument.init了。此代码巧妙地做到了代码逻辑的封装,又公开了外部需要访问的接口,是模块化最佳实践之一。

3.确保在定义变量时使用var关键字。如果定义变量时没有使用var,浏览器解析时并不会报错,而是自动把这一变量解析为全局变量,比如如下的代码就定义了一个全局的变量length:

(function()

{

length=0;

function init(){...}

function action(){...}

}

)()

  • 使用简化的编码方式

//对象创建

var persion=new Object();

person.age=23;

person.name='daniel';

改为:

var person={age:23,name:'daniel'};

//数组创建

var list=new Array();

list[0]=12,

list[1]=20;

list[2]=24;

改为:

var list=[12,20,24];

  • 使用比较运算符=== 而不是 ==

  • 避免使用with语句

在javascript中,with语句可用来快捷地访问对象地属性。with语句地格式如下:

with(object)

{

.......

}

with语句地原理是:javascirpt解析和运行时,会给with语句单独建立一个作用域,而和with语句结合的属性则成为了此作用域的局部变量,因此可直接访问。例如:

with(Math)

{

a=PI*r*r;

}

以下代码等同于以上代码

a=Math.PI*r*r;

使用with语句确实简化了代码,但使用with语句可能也会带了一些bug已经兼容问题

  1. 使得代码难以阅读,对于with语句内部的变量引用,只有在运行时才能知道变量属于哪个对象。例如:

function f(x,o)

{

with(o)

{

print(x);

}

}

以上with语句中的x,可能来自于参数x,也可能来自o参数上的x属性。

2.with语句的设计方面也有缺陷,在with语句内部修改和with语句结合的对象后,并不能同步到with内部,即不能保证对象数据的一致性。例如:

var group ={

value:{

     node:1

}

};

with(group.value)

   {

     group.value={

      node:2

      };

     //显示错误:1

     console.log(node);

   }

//显示正确:2

console.log(group.value.node);

  • 避免使用eval

  1. 有时使用eval函数会让代码难以阅读,影响代码的可维护性。如:

如果通过变量来获取某个对象的属性值,可以使用eval('obj.'+key);

其实可以使用下标法取得属性值:obj[key]

2.    eval的使用也存在安全性问题,因为它会执行任意传入的代码,而传入的代码有可能是未知的或者来自不受控制的源。

.使用更严格的编码格式

设立严格模式的目的主要是为了消除javascript语法上不合理的地方,从而提高代码安全性、编译效率、增加运行速度且更好地兼容javacscript未来的新版本。

严格模式主要是针对如下不合理的地方做了改进,包括:禁用with关键字、防止意外的全局变量、函数中的this 不再默认指向全局、防止函数参数重名、防止对象 属性重名、更安全的使用eval等。

启用严格模式很简单,主要在代码中添加如下代码即可:

"use strict";

使用严格模式时需要遵循的几条最佳实践。

  1. 不要在全局中启用严格模式

为了兼容一些老代码,最好不要全局启用严格模式,如果想给大量的代码设置严格模式,则可以把代码包含在一个立即执行的函数中,并在函数开头启用严格模式,示例代码如下:

(function(){

"use strict"

// ..........

})();

2. 如果要更严格地编写javascript代码,可以使用javascript代码检查工具。目前最流行的检查工具主要是JSLint和JSHint。

高维护性的javascript的更多相关文章

  1. C++ //多态案例 -计算器类(普通写法 和 多态写法) //利用多态实现计算器 //多态好处: //1.组织结构清晰 //2.可读性强 //3.对于前期和后期扩展以及维护性高

    1 //多态案例 -计算器类(普通写法 和 多态写法) 2 3 #include <iostream> 4 #include <string> 5 using namespac ...

  2. 如何编写可维护的面向对象JavaScript代码

    能够写出可维护的面向对象JavaScript代 码不仅可以节约金钱,还能让你很受欢迎.不信?有可能你自己或者其他什么人有一天会回来重用你的代码.如果能尽量让这个经历不那么痛苦,就可以节省不少时 间.地 ...

  3. 推荐 greenrobot eventbus,简化安卓开发,提高安卓维护性,优化安卓性能

    最近在研究移动开发,广泛的阅读有关cordova,apicloud,android资料.发现安卓的开发还是很简单的.再发现greenrobot eventbus开源框架不仅可以简化安卓开发,有可以大幅 ...

  4. 探索 ConcurrentHashMap 高并发性的实现机制--转

    ConcurrentHashMap 是 Java concurrent 包的重要成员.本文将结合 Java 内存模型,来分析 ConcurrentHashMap 的 JDK 源代码.通过本文,读者将了 ...

  5. 【转】探索 ConcurrentHashMap 高并发性的实现机制

    原文链接:https://www.ibm.com/developerworks/cn/java/java-lo-concurrenthashmap/  <探索 ConcurrentHashMap ...

  6. 使用typescript开发js代码提升代码维护性

    function test() { var gs = new Greeter('ss'); alert( gs.greet()); } window.onload = test; class Gree ...

  7. 异步函数封装请确保异步性(Javascript需要养成的良好习惯)

    背景假设: 你有许多的配置信息存放在服务器上,因为配置太多,不希望每次都把所有的配置信息都写到前端,希望能需要用的时候再获取就好了. 因为Javascript单线程运行,你不希望堵塞ui渲染于是你专门 ...

  8. 高健壮性css---Float详细

    (一)关于float 首先我们了解到,CSS网页布局的原理,就是按照HTML代码中对象声明的顺序,以流布局的方式来显示它,而流布局就不得不说到float浮动技术..在HTML中的所有对象,默认分为两种 ...

  9. 《编写高质量代码改善JavaScript程序的188个建议》读书笔记

    逗号运算符比较怪异.如    var a =(1,2,3,4);alert(a);// 4      var a = 1,2,3,4;//报错 注意a++和++a的差别,变量在参与运算中不断地变化.v ...

随机推荐

  1. java基础之二维数组不定义列数

    有一种特殊的二维数组,它的行数确定,但是每行的列数不确定.这样的的数组实现方法:先创建制定行数,列数缺省的二维数组,然后对数组的每一行重新初始化.举例如下: package day5; //第二种定义 ...

  2. mysql索引优化及explain关键字段解释

    一.explain关键字解释 1.id MySQL QueryOptimizer 选定的执行计划中查询的序列号,表示查询中执行select 子句或操作表的顺序.id 值越大优先级越高,越先被执行.id ...

  3. WPF界面设计中常用的一些代码片段及属性

    一.窗体去掉标题栏.消除掉标题栏后的白边,把窗体置于屏幕中间,窗口大小不能改变. WindowStyle="None" AllowsTransparency="True& ...

  4. 从github下载项目出现yes/no的选项,无法下载项目

    解决办法: # 本地执行: ssh-keygen # 将id_rsa_pub文件中公钥拷贝到github上的ssh认证 oodful@:~/Volumes/Term2 :::$cat ~/.ssh/i ...

  5. Interface Builder: What are the UIView's Layout iOS 6/7 Deltas for?

    up vote57down votefavorite 19 I just noticed the iOS 6/7 Delta property found under the UIView's str ...

  6. Office2010 破解(Microsoft Toolkit 2.4.3.exe)

    这两天破解刚安装好的office2010,总是报错 刚才重新下载了Microsoft Toolkit 2.4.3.exe工具后,破解成功,操作如下: 选择office按钮后,如下操作,

  7. 深入浅出 Java Concurrency (5): 原子操作 part 4[转]

    在JDK 5之前Java语言是靠synchronized关键字保证同步的,这会导致有锁(后面的章节还会谈到锁). 锁机制存在以下问题: (1)在多线程竞争下,加锁.释放锁会导致比较多的上下文切换和调度 ...

  8. Filter - 全局编码 (装饰者模式)

    Tomcat7以前需要处理get乱码,tomcat8以后不需要处理get乱码,因为tomcat内部会处理. 乱码原因: package cn.itcast.web.filter; import jav ...

  9. WIN10 Internet协议版本tcp/ipv4属性灰色没有法点击

    问题图如下: 1.右键打开“计算机”点击菜单,选中“管理”: 2.进入计算机管理后,打开“设备管理器”,然后在右侧打开点击“网络适配器”,如果有驱动的话,在驱动上右键点击菜单,选中卸载: 3.卸载网卡 ...

  10. redis常见的面试题

    redis和memched有什么区别,为什么单线程的redis比多线程的memched效率高 string:ky类型 hash:字典redis的哈希结构可以使你像在数据库中更新一个属性一样只修改某一项 ...