摘要：类似的情况还有，方法和方法等。今天我说一个最简单。代码如下和也可以实现，但是生成的是一个整数，如下分割线其它类型数据转布尔数据下面的转换，大家一看就明白了，不多说。缓存变量循环缓存分割线第一段就是每一次循环的时候，都要查询一次。
1.前言
从大学到现在，接触前端已经有几年了，感想方面，就是对于程序员而言，想要提高自己的技术水平和编写易于阅读和维护的代码，我觉得不能每天都是平庸的写代码，更要去推敲，去摸索和优化代码，总结当中的技巧，积极听取别人的建议，这样自己的技术水平会提高的更快。那么今天，我在这里就分享一下关于javascript方面的写作的实用技巧和建议，这些技巧和建议是我平常在开发项目上会用到的，希望能让大家学到知识，更希望能起到一个交流意见的作用，也就是说大家有什么好的技巧或者建议，欢迎分享，或者觉得我的想法存在什么问题，欢迎指出!
2.更短的数组去重写法[...new Set([2,"12",2,12,1,2,1,6,12,13,6])] //[2, "12", 12, 1, 6, 13] //es6的新特性3.对象深浅拷贝
关于对象的深浅拷贝，我个人见解就是有一下几点：
1.深拷贝和浅拷贝只针对像Object, Array这样的引用类型数据。
2.浅拷贝是对对象引用地址进行拷贝，并没有开辟新的栈，也就是拷贝后的结果是两个对象指向同一个引用地址，修改其中一个对象的属性，则另一个对象的属性也会改变。
3.深拷贝则是开启一个新的栈，两个对象对应两个不同的引用地址，修改一个对象的属性，不会改变另一个对象的属性。
浅拷贝var myInfo={name:"守候",sex:"男"};
var newInfo=myInfo;
newInfo.sex="女";
console.log(myInfo) //{name: "守候", sex: "女"}
假-深拷贝
假-深拷贝这个是自己随性命名的，大家看看就好，别当真！
var myInfo={name:"守候",sex:"男"};
var newInfo=Object.assign({},myInfo)
newInfo.sex="女";
console.log(myInfo) //{name: "守候", sex: "男"}
console.log(newInfo) //{name: "守候", sex: "女"}
真-深拷贝
真-深拷贝这个是自己随性命名的，大家看看就好，别当真！
看着深浅拷贝，区别写法很简单，但是那个上面的深拷贝写法是有问题的。看下面案例
var arr=[{a:1,b:2},{a:3,b:4}]
var newArr=Object.assign([],arr)
//截断数组
newArr.length=1
console.log(newArr)//[{a:1,b:2}]
console.log(arr)//[{a:1,b:2},{a:3,b:4}]
//操作newArr，这里看着对arr没影响，实际上已经挖了一个坑，下面就跳进去
newArr[0].a=123
//修改newArr[0]这个对象，也是影响了arr[0]这个对象
console.log(arr[0])//{a: 123, b: 2}
为什么会这样呢，因为Object.assign并不是深拷贝，是披着深拷贝外衣的浅拷贝。最多也是Object.assign会课拷贝第一层的值，对于第一层的值都是深拷贝，而到第二层的时候就是 复制引用。类似的情况还有，slice方法和concat方法等。
要解决这个问题，就得自己封装方法！如下
//利用递归来实现深拷贝，如果对象属性的值是引用类型（Array,Object），那么对该属性进行深拷贝，直到遍历到属性的值是基本类型为止。
function deepClone(obj){
if(!obj&& typeof obj!== "object"){
return;
}
var newObj= obj.constructor === Array ? [] : {};
for(var key in obj){
if(obj[key]){
if(obj[key] && typeof obj[key] === "object"){
newObj[key] = obj[key].constructor === Array ? [] : {};
//递归
newObj[key] = deepClone(obj[key]);
}else{
newObj[key] = obj[key];
}
}
}
return newObj;
}
var arr=[{a:1,b:2},{a:3,b:4}]
var newArr=deepClone(arr)
console.log(arr[0])//{a:1,b:2}
newArr[0].a=123
console.log(arr[0])//{a:1,b:2}
还有一个方法就是简单粗暴法，我现在在用的一个方法！原理很简单，就是先把对象转成字符串，再把字符串转成对象！也能实现同样效果
var newArr2=JSON.parse(JSON.stringify(arr));
console.log(arr[0])//{a:1,b:2}
newArr2[0].a=123
console.log(arr[0])//{a:1,b:2}
上面所说的浅拷贝，真假深拷贝（自己随性命名的），这几种情况，在开发上都有可能要用到，至于要使用哪一种方式，视情况而定！
4.使用事件委托一个简单的需求，比如想给ul下面的li加上点击事件，点击哪个li，就显示那个li的innerHTML。这个貌似很简单！代码如下！
很简单，这样就实现了，实际上这里有坑，也待优化！
1.for循环，循环的是li，10个li就循环10次，绑定10次事件，100个就循环了100次，绑定100次事件！
2.如果li不是本来就在页面上的，是未来元素，是页面加载了，再通过js动态加载进来了，上面的写法是无效的，点击li是没有反应的！
所以就者需要用事件委托（即使不考虑上面的第二种情况，也是建议使用事件委托）！代码如下
这样写，即使是动态添加进来的li点击也有反应，还有一个就是ul只有一个，事件绑定在ul上，无论li多少个，都是添加一次事件！但是也是可能会有问题，如果li下面还有子元素，那么点击的时候，target可能不是li，而是鼠标点击那个位置的最底层元素！如下图，如果鼠标点击白色区域，那个target就是body元素,鼠标点击绿色区域target就是div元素，鼠标点击蓝色区域target就是ul，点击橙色就是li。
5.使用对象作为函数参数大家试想下这样一个函数--函数接受几个参数，但是这几个参数都不是必填的，函数该怎么处理？是不是下面这样
function personInfo(name,phone,card){
...
}
//以上函数，可以任意传参数。比如我想传card等于1472586326。这下是不是这样写
personInfo("","","1472586326")
有没有觉得上面写法奇怪，不太优雅？下面这里看着舒服一点！
function personInfo(opt){
...
}
personInfo({card:"1472586326"})
再想一下，如果一个函数，参数很多，怎么处理？
function test(arg1,arg2,arg3,arg4,arg5,arg6,arg7){
...
}
密集恐惧症复发没有复发？下面这样看着会舒服一点！
function personInfo(opt){
...
}
最后再想一下，如果需求改了，操作函数也要改！函数也要增加一个参数。
//原来函数
function personInfo(name,phone,card){
...
}
//修改后
function personInfo(name,age,phone,card){
...
}
这样就是参数修改一次，函数的参数就要修改一次！如果是用对象，就不会出现这样问题！
//修改前后都是这样，变得是函数的操作内容和调用时候的传参！
function personInfo(opt){
...
}
看了上面的几个栗子，总结来说，就是当函数的参数不固定的时候，参数多(三个或者三个以上)的时候，建议用一个对象记录参数，这样会比较方便，也为以后如果参数要改留了条后路！
6.使用push和apply合并数组合并数组这个已经是老生常谈的话题了，方法也是多种多样！
concatvar arr1=[1,2,3,4,5],arr2=[6,7,8,9,10]; arr1=arr1.concat(arr2) console.log(arr1)//[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
concat会一个全新的数组，表示arr1和arr2两个数组的组合，并让arr1和arr2不变。简单吧？
但如果arr1和arr2的长度都很长，那就产生了一个很长很长的数组，内存又被占用了那么多。但是数组长度没限制！
