for和for in区别

for ... in 循环中的代买每执行一次,就会对数组的元素或者对象的属性进行一次循环操作。

    eg:应该用在非数组对象的遍历上,使用for-in进行循环也被称为“枚举”。 

 

for (变量 in 对象)
{
    在此执行代码
}

“变量”用来指定变量,指定的变量可以是数组元素,也可以是对象的属性。
var data = {
     '4': 'first',
     '3': 'second',
     '2': 'third',
     '1': 'fourth'
 };
 for (var i in data) {
     console.log(i + "  " + data[i])
 }

IE11, chrome31, firefox23的打印如下:

1  fourth
2  third
3  second
4  first
var obj = {
  "first":"first",
   "zoo":"zoo",
  "2":"2",
  "34":"34",
  "1":"1",
  "second":"second"
};
for (var i in obj) { console.log(i); };

IE11, chrome31, firefox23的打印如下:

1
2
34
first
zoo
second

 
事实上,它不一定根据定义时的顺数输出,所有浏览器的最新版本现在都按chrome执行,先把当中的非负整数键提出来,排序好输出,然后将剩下的定义时的顺序输出。由于这个奇葩的设定,让avalon的ms-with对象排序不按预期输出了。只能强制用户不要以纯数字定义键名。

 

所以建议不要对数组执行for in循环,事实上,在高性能javascript这本书中,也强调了for in循环的不好,因为它总是会访问该对象的原型,看下原型上是否有属性,这在无意中就给遍历增加了额外的压力。

 

解决方法:

如果某个对象具有给定名称的属性,那么Object.prototype.hasOwnProperty(name)返回true。如果该对象是从原型链中继承了该属性,或者根本没有这样的一个属性,则返回false。通过hasOwnProperty限定for in循环在当前中遍历,而不用去考虑它的原型属性。

function finalArray(){
var array=[1,2,3,4,5 ];
Array.prototype.age=13;
var result=[];
for(var i in array){
if(array.hasOwnProperty(i)){
result.push(array[i]);
}
}
alert(result.join(''));
}

注意事项:

1.有一部分浏览器,例如早期的safari浏览器,不支持这个方法

2.对象经常被用作哈希值,这就是存在hasOwnProperty被另外的属性屏蔽的风险(但是我估计没有人那么无聊使用这个属性)


文章来源:http://caibaojian.com/js-loop-for-in.html

posted on 2017-03-20 16:58  起舞弄清影wy  阅读(921)  评论(0编辑  收藏  举报