JavaScript 最佳实践

javascript 最佳实践

请避免全局变量、new===eval()

 

1. 避免全局变量

请尽量少地使用全局变量。

它包括所有的数据类型、对象和函数。

全局变量和函数可被其他脚本覆盖。

 

2. 始终声明局部变量

所有在函数中使用的变量应该被声明为局部变量。

局部变量必须通过 var 关键词来声明,否则它们将变成全局变量。

严格模式不允许未声明的变量。

 

3. 在顶部声明

一项好的编码习惯是把所有声明放在每段脚本或函数的顶部。

这么做的好处是:

  • 获得更整洁的代码
  • 提供了查找局部变量的好位置
  • 更容易避免不需要的全局变量
  • 减少不需要的重新声明的可能性
// 在顶部声明
var firstname, lastname, price, discount, fullprice;
// 稍后使用
firstname = "bill";
lastname = "gates";
price = 19.90;
discount = 0.10;
fullprice = price * 100 / discount;

也可以用于循环变量:

// 在顶部声明
var i;
// 稍后使用
for (i = 0; i < 5; i++)  {

默认地,javascript 会将所有声明移至顶部(javascript hoisting)。

 

3. 初始化变量

在您声明变量时对其进行初始化是个好习惯。

这么做的好处是:

  • 更整洁的代码
  • 在单独的位置来初始化变量
  • 避免未定义值
// 在开头进行声明和初始化
var firstname = "",
    lastname  = "",
    price = 0,
    discount = 0,
    fullprice  = 0,
    myarray = [],
    myobject = {};

变量初始化使我们能够了解预期用途和预期的数据类型。

 

4. 请不要声明数值、字符串或布尔对象

请始终将数值、字符串或布尔值视作原始值。而非对象。

如果把这些类型声明为对象,会拖慢执行速度,并产生讨厌的副作用:

范例

var x = "bill";             
var y = new string("bill");
(x === y) // 结果为 false,因为 x 是字符串,而 y 是对象。

或者甚至更糟:

范例

var x = new string("bill");             
var y = new string("bill");
(x == y) // 结果是 false,因为你无法比较对象。

 

5. 请勿使用 new object()

  • 请使用 {} 来代替 new object()
  • 请使用 "" 来代替 new string()
  • 请使用 0 来代替 new number()
  • 请使用 false 来代替 new boolean()
  • 请使用 [] 来代替 new array()
  • 请使用 /()/ 来代替 new regexp()
  • 请使用 function (){}来代替 new function()

范例

var x1 = {};           // 新对象
var x2 = "";           // 新的原始字符串值
var x3 = 0;            // 新的原始数值
var x4 = false;        // 新的原始布尔值
var x5 = [];           // 新的数组对象
var x6 = /()/;         // 新的正则表达式
var x7 = function(){}; // 新的函数对象

 

6. 意识到自动类型转换

请意识到数值会被意外转换为字符串或 nan(not a number)。

javascript 属于松散类型。变量可包含不同的数据类型,并且变量能够改变其数据类型:

范例

var x = "hello";     // typeof x 为字符串
x = 5;               // 把 typeof x 更改为数值

如果进行数学运算,javascript 能够将数值转换为字符串:

范例

var x = 5 + 7;       // x.valueof() 是 12,  typeof x 是数值
var x = 5 + "7";     // x.valueof() 是 57,  typeof x 是字符串
var x = "5" + 7;     // x.valueof() 是 57,  typeof x 是字符串
var x = 5 - 7;       // x.valueof() 是 -2,  typeof x 是数值
var x = 5 - "7";     // x.valueof() 是 -2,  typeof x 是数值
var x = "5" - 7;     // x.valueof() 是 -2,  typeof x 是数值
var x = 5 - "x";     // x.valueof() 是 nan, typeof x 是数值

用字符串减去字符串,不会产生错误而是返回 nan(not a number):

范例

"hello" - "dolly"    // 返回 nan

 

7. 使用 === 比较

== 比较运算符总是在比较之前进行类型转换(以匹配类型)。

=== 运算符会强制对值和类型进行比较:

范例

0 == "";        // true
1 == "1";       // true
1 == true;      // true
0 === "";       // false
1 === "1";      // false
1 === true;     // false

 

8. 使用 parameter defaults

如果调用函数时缺少一个参数,那么这个缺失参数的值会被设置为 undefined

undefined 值会破坏您的代码。为参数设置默认值是一个好习惯。

范例

function myfunction(x, y) {
    if (y === undefined) {
        y = 0;
    }
}

 

9. 用 default 来结束 switch

请使用使用 default 来结束您的 switch 语句。即使您认为没有这个必要。

范例

switch (new date().getday()) {
    case 0:
        day = "sunday";
        break;
    case 1:
        day = "monday";
         break;
    case 2:
        day = "tuesday";
         break;
    case 3:
        day = "wednesday";
         break;
    case 4:
        day = "thursday";
         break;
    case 5:
        day = "friday";
         break;
    case 6:
        day = "saturday";
         break;
    default:
        day =  "unknown";
} 

 

10. 避免使用 eval()

eval() 函数用于将文本作为代码来允许。在几乎所有情况下,都没有必要使用它。

因为允许任意代码运行,它同时也意味着安全问题。

下一节:js 常见错误

js 教程

相关文章