[译] 新手和老手都将受益的JavaScript小技巧

这篇文章会分享一些鲜为人知但却很强大的JavaScript技巧, 各个级别的JavaScript开发者都会从中受益.

 

1. 用数组的length属性清空数组

 

我们知道在JS中对象类型是按引用传递的, 有时候我们却会被这个规则所制约. 比如下面的例子:

 

var arr1 = arr2 = [1, 2, 3];   
 
//Change arr1 
arr1 = []; // arr2 will still be [1,2,3]

arr1和arr2在初始化的时候指向同一个数组 [1, 2, 3] , 之后arr1重新指向 [] , arr2的引用并没有变化, 仍然指向 [1, 2, 3]. 但是如果我们想让arr1和arr2都指向 [] 该怎么做呢? 我们可以使用数组的 length 属性. 当我们设置 arr1.lenget = 0 , 数组arr1中的元素被清空. 然而引用关系并没有变化, 所以 arr1 和 arr2 现在都指向了空数组 [] .

 

2. 用push方法合并数组

 

我们习惯用 concat() 方法来合并2个数组, 比如:

var arr1=[1,2,3];
var arr2=[4,5,6];
var arr3=arr1.concat(arr2);
arr3;
[1, 2, 3, 4, 5, 6]

 

我们同样可以用 push() 方法来实现:

var arr1=[1,2,3];
var arr2=[4,5,6];
Array.prototype.push.apply(arr1,arr2);
arr1
[1, 2, 3, 4, 5, 6]

 

(译者注: 关于两者速度的比拼, 我在Firefox和Chrome下得到了不同的结果, 请看 http://jsperf.com/javascript-array-concat-vs-push 更全的测试用例: http://jsperf.com/array-concat-vs-push-2/14 )

 

3. 特征检测

 

许多API里我们都能见到特征检测的代码, 查看浏览器是否支持某个属性或方法为了有更好的浏览器兼容性. 比如:

 

if(window.opera){
    console.log("OPERA");
}else{
    console.log("NOT OPERA");
}

这段代码是正确的, 但是可能不够效率. 它会在浏览器中初始化一些资源, 更效率的做法是检查对象中是否有这个key.

 

if("opera" in window){
    console.log("OPERA");
}else{
    console.log("NOT OPERA");
}

4. 检验一个对象是否是数组

 

在JavaScript里, 可以用 typeof 来检查变量类型. typeof 可以返回: number , boolean, string, object, function 和 undefined. 并没有 array . 实际上数组是object类型. 那么怎么来验证对象是否是数组呢? 在最新的ECMAScript 5中, 可以用 Array.isArray(object) 来检验. 但是ECMAScript 5还没有推广开.

 

我们可以用下面的方法:

 

var obj=[];
Object.prototype.toString.call(obj)=="[object Array]";
true

 

原文地址: http://www.pixelstech.net/article/1377076088-JavaScript-tips-both-novice-and-veteran-developers-can-benefit-from