js代码常见技巧总结

1. 避免链式公告

后果：可可以引入全局变量

 //错误的写法 var a = b = 0;

这段代码中,b实际上被公告为全局变量。由于操作符优先级是是从右往左，所以该语句相当于:

var a = (b = 0)

此时b未公告就被直接赋值，所以b成了全局变量

2. 单一var准则

这条规则的意思是，把函数内部的所有变量，放到顶部公告。比方：

 //示例 function A(){ var a = 1, b = 2, c = a + b ; }

优点：

• 便于查找函数内部用的局部变量
• 防止变量未定义时就被用
• 防止变量公告提升后引发的误会

关于第三点，这里举个例子说明：

 var x = 1; function A(){ console.log(x);//第一处输出 ，注意结果 var x = 2; console.log(x);//第二处输出 2，没问题 } 

从代码上看，第二处输出一定没问题，可可以会有人认为第一处输出的是1，由于此时在函数内部还没公告变量x，根据作使用域链，向外层查找的话，x值为1。但是实际输出的值应该是undefined，由于js允许在函数任何地方公告变量，并且无论在哪里公告都等同于在顶部公告，这就是公告提升。所以上面的代码相当于:

 var x = 1; function A(){ var x;//提升到顶部 console.log(x);//此时已公告 未赋值 x = 2;//赋值 console.log(x); } 

3. 用for循环时，缓存长度值

通常使用用for循环遍历数组时，会采使用以下写法：

for(var i = 0;i
这段代码存在的问题在于，在循环的每个迭代步骤，都必需访问一次arr的长度。假如arr是静态数值还好，但是我们在用js时可可以会碰到arr是dom元素对象，因为dom对象载页面下是活动的查询，这个长度查询就相当耗时，
//使用len缓存长度值for(var i = 0,len = arr.length;i
按照上面的代码，我们在第一次获取长度值时就缓存这个长度值，即可以避免上述问题。
4. 用for-in时，添加hasOwnProperty()判断
for-in通常使用来枚举对象的属性和方法，但是这个方法会枚举范围包括对象和对象的原型对象（对原型对象不理解的能看看我之前写的文章传送门）此时，利使用hasOwnProperty()方法能帮我们过滤出只在对象本身上的属性和方法，或者者只在原型链的属性和方法
for(var key in obj){ if(obj.hasOwnProperty(key)){ // 对象本身的属性或者者方法 } else{ // 原型链的属性和方法 }}/* 下面是一个具体的例子 */ function A(name){ this.type = 'A类'; this.name = name || '未命名'}var a = new A('a');function B(name){ this.subtype = 'B类';}// 建立原型链B.prototype = a;B.prototype.sayHello = function(){}var b = new B();// 遍历属性for(var key in b){ //对象自身属性 if(b.hasOwnProperty(key)){ console.log('对象自身的属性或者方法:'+key)  } //上述表达式的另一种写法 if(B.prototype.hasOwnProperty.call(b,key)){ console.log('对象自身的属性或者方法:'+key) } else { console.log('原型链的属性或者方法:'+key) }}
5. 用===代替==
这个算是比较常见的了，由于js在做比较判断时，会执行强制类型转换，比方false == 0返回true这样的情况，用===能执行严格的等价比较，更易于阅读代码（后来阅读的人就不需要判断这个是遗漏还是成心用强制类型转换简写）
6. 用parseInt()时，带上第二个参数。
parseInt()使用于从字符串中获取数值，第二个参数代表进制,默认是10。我们在用的时候可可以习惯性忽略这个参数，但是在少量情况下会有问题：当字符串的开头为0时，在es3里会被当做是八进制，es5里面依然当做10进制，为了代码的一致性以及避免不必要的失误，应该每次用时都带上参数:
var x = parseInt('089',10);//用时都带上进制参数
7. 大括号的用
大括号的用主要是2个方面：
第1，不要省略大括号，即便能忽略,比方：
for(var i =1;i<10 ;i++) console.log(i) //此处准则上能忽略大括号
上述语句并没有问题，但是假如后期函数体内添加了其余语句的时候，很容易不记得补上大括号，因而建议都带上大括号；
第2，大括号的必需跟在前一个语句的同一行
这个地方为什么加粗了呢？由于这个问题非常容易被忽略，通常我们都觉得大括号是跟在语句的同一行还是下一行只是习惯问题，但是实际上不是的！看下面这个例子：
function func(){ return  { name:'xxx' }}var res = func()console.log(res)//输出undefined
是不是觉得很奇怪，看代码第一感觉应该是输出一个包含name属性的对象。请注意，因为js的分号插入机制：假如语句没有用分号结束，会自动补充分号，因而上面的代码实际相当于如下写法：
function func(){ return undefined;//自动插入分号 { name:'xxx' }}
正确的写法应该是：
function func(){ return { name:'xxx' }}var res = func()console.log(res)//输出{name:'xxx'}