web前端：高维护性的javascript

作者: tuohaibei 更新于： 2020-03-23 20:33:35

　　当eval的第二个参数为字符串"unsafe"时，传递给eval方法的代码在调用代码所在的安全上下文中执行。第二个参数是区分大小写的，因此，字符串"Unsafe"或"UnSAfE"不会重写受限安全上下文。

　　以下内容摘自web前端开发最佳实践--党建著

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

　　避免定义全局变量或函数

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

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

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

　　varmyTes={

　　length:0'

　　init:function(){...},

　　action:function(){...}

　　}

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

　　（function()

　　{

　　varlength=0;

　　functioninit(){...}

　　functionaction(){...}

　　})()

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

　　varmyDocument=（function()

　　{

　　varlength=0;

　　functioninit(){...}

　　functionaction(){...}

　　return{

　　init:init

　　}

　　})();

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

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

　　(function()

　　{

　　length=0;

　　functioninit(){...}

　　functionaction(){...}

　　}

　　)()

　　使用简化的编码方式

　　//对象创建

　　varpersion=newObject();

　　person.age=23;

　　person.name='daniel';

　　改为：

　　varperson={age:23,name:'daniel'};

　　//数组创建

　　varlist=newArray();

　　list[0]=12,

　　list[1]=20;

　　list[2]=24;

　　改为：

　　varlist=[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已经兼容问题

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

　　functionf(x,o)

　　{

　　with(o)

　　{

　　print(x);

　　}

　　}

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

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

　　vargroup={

　　value:{

　　node:1

　　}

　　};

　　with(group.value)

　　{

　　group.value={

　　node:2

　　};

　　//显示错误：1

　　console.log(node);

　　}

　　//显示正确：2

　　console.log(group.value.node);

　　避免使用eval

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

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

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

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

　　.使用更严格的编码格式

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

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

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

　　"usestrict";

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

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

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

　　（function(){

　　"usestrict"

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

　　})();

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

　　eval是Javascript内置函数，用于计算字符串表达式的值。例如eval("2+3")返回的是5。