[译] 新手和老手都将受益的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
