JavaScript最佳实践五条

发布者：前端集合 // 发布时间：2016-08-31 22:14:00 // 分类：前端集合 // 访问: 4,919 次 // 热度:

避免污染全局变量

var foo = 42;
console.log(foo);

上面的代码等同于

window.foo = 42;

如下代码会覆盖系统默认print函数，会让网页无法打印：

function print () {
   // do something
}
print();

我们只需要简单的做一下变更，就能避免污染全局变量：

(function () {
   var foo = 42;
   console.log(window.foo);
   // → undefined
   console.log(foo);
   // → 42
})();

如果更进一步，可以将window等全局变量当作参数传到function：

(function (global, doc) {
  global.setTimeout(function () {
     doc.body.innerHTML = "Hello!";
  }, 1000);
})(window, document);

使用use strict

严重推荐使用use strict！

比如下面就是一个不好的实践：

(function () {
   a = 42;
   console.log(a);
   // → 42
})();
console.log(a);
// → 42

如果使用use strict，则会报错，让你提早知道错误所在：

(function () {
   "use strict";
   a = 42;
   // Error: Uncaught ReferenceError: a is not defined
})();

使用全等===

使用==时：

"42" == 42
// → true

使用全等时===

"42" === 42
// → false

发现 && 和 || 的奥秘

有时使用 && 和 || 会有惊喜哦，能让你的代码更短：

"" || "foo"
// → "foo"

undefined || 42
// → 42

// 0的判断
var a = 0;
a || 42
// → 42

// if else妙用
var b = typeof a === "number" ? a : 42;
// → 0

再比如：

expr && doSomething();

// 等同于
if (expr) {
   doSomething();
}

再来个更妙的：

function doSomething () {
   return { foo: "bar" };
}
var expr = true;
var res = expr && doSomething();
res && console.log(res);
// → { foo: "bar" }

值类型转换

// 任何值转为Number

var foo = "42";
var myNumber = +foo;
// → 42

var negativeFoo = -foo; 
// → -42

// 对象转为数组
var args = { 0: "foo", 1: "bar", length: 2 };
Array.prototype.slice.call(args)
// → [ 'foo', 'bar' ]

// 转为布尔值
/// 正正得正
var t = 1;
var f = 0;
!!t
// → true
!!f
// → false

/// 正负得负
!t
// → false
!f
// → true

// 转为字符串
var foo = 42;
"" + foo
// → "42"

foo = { hello: "world" };
JSON.stringify(foo);
// → '{ "hello":"world" }'

JSON.stringify(foo, null, 4); // 格式化
// →
// '{
//    "hello": "world"
// }'

Tags: JavaScript, js, javascript最佳实践, js最佳实践