前端js代码优化

今天给大家分享下js代码优化的相关技巧。

1.使用“+”转换为数值

    我们平时开发过程中需要将数字字符串创转为number类型，大多数都会用JavaScript parseInt() 函数，请看我下面的例子：

 function toNumber(strNumber){
      return +strNumber;
 }
 console.log(toNumber("123456"));// 123456
 console.log(toNumber("abc"));// NaN

 //作用于Date函数直接返回时间戳
 console.log(+new Date());//

注意只能用于数字字符串，否则返回“NaN”。

2.减少条件代码

if(conected){
    login();
}
//上述可以简写为
conected &&  login();

3.在循环中缓存array.length

我们在开发中，通常遇到要循环遍历数组的情况，大家一般都会像下面一样写循环遍历，循环体中，每循环一次，就要重计算数组长度，如果数组太大，会影响程序性能。我们应该缓存数组的长度，提高程序性能。

//优化前
for( var i=0;i<array.length;i++){
   ......
}
//优化后
for( var i=0 , length = array.length;i<length;i++){
   ......
}

4.获取数组中最后的元素

 var array = [1,2,3,4,5,6];
 console.log(array.slice(-1));// [6]
 console.log(array.slice(-2));// [5,6]
 console.log(array.slice(-3));// [4,5,6]

5.数组截断

 var array = [1,2,3,4,5,6];
 console.log(array.length);//
 array.length = 3;
 console.log(array.length);//
 console.log(array);// [1,2,3]

6.数组合并

    在开发中，我遇到一次需要：实现下拉刷新的功能，需要不断向数组中添加新数组。我当时用到的是Array.concat()方法。但是数据量大的时候会出现长时间数据加载不出来的情况。我在网上查找了半天解决了这个问题，使用Array.push.apply(arry1,arry2)来实现。减少内存消耗。

//优化前
var arry1 = [1,2,3];
var arry2 = [4,5,6];
console.log(arry1.concat(arry2));//[1,2,3,4,5,6]
 
//优化后
var arry3 = [1,2,3];
var arry4 = [4,5,6];
console.log(arry3.push.apply(arry4));//[1,2,3,4,5,6]

今天的知识分享到这里，希望大家每天都能进步一点点！

toNumber