javascript中的for in循环和for in循环的使用陷阱

javascript中的for循环和for...in循环还是有些区别的,比如定义一个数组,然后用for..in循环输出

var array=[1,2,3,4,5,6];

for(var s in array)

{

  console.log(s+' ');

}

 输出的结果是0 1 2 3 4 5 竟然不是输出1-6。然后又定义了个比较有区分的(姑且这么叫吧)数组

var array=['jack','marry','jackson'];

for(var s in array)

{

  console.log(s+' ');

}

 输出0 1 2 这样看起来for..in输出的是数组的索引,而不是数组内容,以前在学习C#的时候for..in输出的是数组中的原始值,而不是索引 。

 但是如果是定义一个对象,对象中有属性,并且给属性赋初始值,那么用for..in输出的是属性名,且看下面:

 

var obj = new Object();

obj.name = '大象';

obj.value1 = '12';

obj.value2 = '334';

for (var items in obj) {

    console.log(items);

}

 输出的是 name、 value1、 value2。这样看来在对象中属性就相当于对象中的索引。

看看下面的例子:

                 var array =["admin","manager","db"];

                 //给Array的原型添加一个name属性

                 Array.prototype.name= "zhangsan";

                 for(var i in array){

                    alert(array[i]);

                 }

运行结果:

admin

manager

db

zhangsan

 

奇观了,怎么平白无故的冒出来一个zhangsan

现在,再看看使用 for循环会怎样?

               vararray = ["admin","manager","db"];

                //给Array的原型添加一个name属性

               Array.prototype.name = "zhangsan";

               for(var i =0 ; i<array.length; i++){

                      alert(array[i]);

               };

运行结果:

admin

manager

db

 

现在明白了,for..in循环会把某个类型的原型(prototype)中方法与属性给遍历出来,所以这可能会导致代码中出现意外的错误。为了避免这个问题,我们可以使用对象的hasOwnProperty()方法来避免这个问题,如果对象的属性或方法是非继承的,那么hasOwnProperty() 方法返回true。即这里的检查不涉及从其他对象继承的属性和方法,只会检查在特定对象自身中直接创建的属性。

 

再看看下面的例子:

               vararray = ["admin","manager","db"];

               Array.prototype.name= "zhangshan";

               for(vari in array){

                      //如果不是该对象自身直接创建的属性(也就是该属//性是原型中的属性),则跳过显示

                       if(!array.hasOwnProperty(i)){

                               continue;

                        }

                        alert(array[i]);

              

运行结果:

admin

manager

db

 

posted on 2017-03-01 15:22  ranyonsue  阅读(519)  评论(0编辑  收藏  举报

导航