前端js代码优化
今天给大家分享下js代码优化的相关技巧。
1.使用“+”转换为数值
我们平时开发过程中需要将数字字符串创转为number类型,大多数都会用JavaScript parseInt() 函数,请看我下面的例子:
1 function toNumber(strNumber){ 2 return +strNumber; 3 } 4 console.log(toNumber("123456"));// 123456
5 console.log(toNumber("abc"));// NaN
7 //作用于Date函数直接返回时间戳 8 console.log(+new Date());// 156826526698565255
注意只能用于数字字符串,否则返回“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.获取数组中最后的元素
1 var array = [1,2,3,4,5,6]; 2 console.log(array.slice(-1));// [6] 3 console.log(array.slice(-2));// [5,6] 4 console.log(array.slice(-3));// [4,5,6]
5.数组截断
1 var array = [1,2,3,4,5,6]; 2 console.log(array.length);// 6 3 array.length = 3; 4 console.log(array.length);// 3 5 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