前端优化技巧总结

（仅方便自已记忆）

前端优化

1字符串String 转换 数字Number 使用 ‘+’

	function changeNumber(str){
			return +str
		}
		console.log(changNumber('123')) // 123
		consile.log(changeNumber('abc')) // NaN

你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。

2 代码条件判断写法改变

 if(a){
	console.log(a)
}
// 简写为
	a && console.log(a)

3 再循环中缓存 数组长度，循环遍历数组时 每循环一次就计算一次数组的长度，当数组太大 会影响性能

	// 基础写法
   for(var i = 0; i < arr.length; i++){
		console.log(arr[i])
	}
	// 优化写法
	for(var i = 0, length = arr.length; i < length; i++){
		console.log(arr[i])
	}

4 数组合并

数组合并方法一般会用 Array.concat(),但是当数据量大时会需要大量时间加载 可以使用Array.push.apply(arr1,arr2)替代

 // 基础写法
 var arr1 = [1,2,3]
 var arr2 = [4,5,6]
 arry1.concat(arr2)
// 优化后
 var arr3 = [1,2,3]
 var arr4 = [4,5,6]
 arry3.push.apply(arr4) 

5.watch中监听Vuex中state的数据

一

	computed:{
		user(){
			return this.$store.state.user.id
		},
		watch:{
			user(newval,oldval){
				console.log(newval,oldval)
			}
		}

二：

	watch:{
		'$store.state.user.id'(newval,oldval){
			console.log(newval,oldval)
		 }