问题：js中定义的数组遍历完成，最后会有一段乱码，如下：
上面的数据正常显示，但是最后会有一段乱码。
原因：用for-in遍历数组的时候最后会多遍历一次，最后的一次在数组中不存在，所以造成了上面的问题。
简单 for 循环
下面先来看看大家最常见的一种写法：
var arr = [1, 2, 3];for(var i = 0; i < arr.length; i++) { console.log(arr[i]);}
当数组长度在循环过程中不会改变时，我们应将数组长度用变量存储起来，这样会获得更好的效率，下面是改进的写法：
var arr = [1, 2, 3];for(var i = 0, len = arr.length; i < len; i++) { console.log(arr[i]);}
for-in
通常情况下，我们可以用 for-in 来遍历一遍数组的内容，代码如下：
var arr = [1, 2, 3];var index;for(index in arr) { console.log("arr[" + index + "] = " + arr[index]);}
一般情况下，运行结果如下：
arr[0] = 1arr[1] = 2arr[2] = 3
但这么做往往会出现问题。
for-in 的真相
for-in 循环遍历的是对象的属性，而不是数组的索引。因此， for-in 遍历的对象便不局限于数组，还可以遍历对象。例子如下：
var person = { fname: "san", lname: "zhang", age: 99};var info;for(info in person) { console.log("person[" + info + "] = " + person[info]);}
结果如下：
person[fname] = sanperson[lname] = zhangperson[age] = 99
需要注意的是， for-in 遍历属性的顺序并不确定，即输出的结果顺序与属性在对象中的顺序无关，也与属性的字母顺序无关，与其他任何顺序也无关。
现在，我们再回过头来看看用 for-in 来循环数组的例子,我们修改一下前面遍历数组的例子：
var arr = [1, 2, 3];arr.name = "Hello world";var index;for(index in arr) { console.log("arr[" + index + "] = " + arr[index]);}
运行结果是：
arr[0] = 1arr[1] = 2arr[2] = 3arr[name] = Hello world
我们看到 for-in 循环访问了我们新增的 “name” 属性，因为 for-in 遍历了对象的所有属性，而不仅仅是“索引”。同时需要注意的是，此处输出的索引值，即 “0″、 “1″、 “2″不是 Number 类型的，而是 String 类型的，因为其就是作为属性输出，而不是索引。那是不是说不在我们的 Array 对象中添加新的属性，我们就可以只输出数组中的内容了呢？答案是否定的。因为 for-in 不仅仅遍历 array 自身的属性，其还遍历 array 原型链上的所有可枚举的属性。下面我们看个例子：
Array.prototype.fatherName = "Father";var arr = [1, 2, 3];arr.name = "Hello world";var index;for(index in arr) { console.log("arr[" + index + "] = " + arr[index]);}
运行结果是：
arr[0] = 1arr[1] = 2arr[2] = 3arr[name] = Hello worldarr[fatherName] = Father
写到这里，我们可以发现 for-in 并不适合用来遍历 Array 中的元素，其更适合遍历对象中的属性，这也是其被创造出来的初衷。却有一种情况例外，就是稀疏数组。考虑下面的例子：
var key;var arr = [];arr[0] = "a";arr[100] = "b";arr[10000] = "c";for(key in arr) { if(arr.hasOwnProperty(key) && /0$|[1-9]\d$/.test(key) && key <= 4294967294 ) { console.log(arr[key]); }}
for-in 只会遍历存在的实体，上面的例子中， for-in 遍历了3次（遍历属性分别为”0″、 “100″、 “10000″的元素，普通 for 循环则会遍历 10001 次）。所以，只要处理得当， for-in 在遍历 Array 中元素也能发挥巨大作用。
为了避免重复劳动，我们可以包装一下上面的代码：
function arrayHasOwnIndex(array, prop) { return array.hasOwnProperty(prop) && /0$|[1-9]\d$/.test(prop) && prop <= 4294967294; // 2^32 - 2}
使用示例如下：
for (var key in arr) { if (arrayHasOwnIndex(arr, key)) { console.log(arr[key]); }}
查询结果如上，简单的说就是for-in中的输出是属性类型，不仅仅是索引。他们的索引值不是我们想象的number类型，而是看到的string类型。
for..in循环会把某个类型的原型(prototype)中方法与属性给遍历出来，所以这可能会导致代码中出现上述的问题。
解决办法：
如果不是该对象自身直接创建的属性（也就是该属//性是原型中的属性），则跳过显示
if(!array.hasOwnProperty(i)){
continue;
}
网友评论