在往期文章中为大家介绍了 JavaScript 如何定义数组。那么这篇文章中 w3cschool 小编来为大家介绍下 JavaScript 如何遍历数组。
 
方法一：for 循环遍历数组
 
var arr=['Tom','Jenny','Jan','Marry'];
 
for(var i=0;i
 
console.log(arr[i]);
 
}
 
实现效果：
 

 
方法二：forEach() 循环遍历数组
 
var arr=['Tom','Jenny','Jan','Marry'];
 
arr.forEach(function(item){
 
console.log(item)
 
})
 
}
 
运行效果如上图。
 
方法三：for-in 循环遍历数组
 
for-in 循环遍历对象属性，JavaScript 中动态获取 key，随后可以得到对象中相对应的 value=obj[key]。
 
const obj={
 
Jenny:22,
 
Tom:20,
 
Jane:18
 
}
 
for(let key in obj){
 
console.log(key+' ages is '+obj[key])
 
}
 
实现效果：
 

 
以上就是文章“JavaScript 如何遍历数组？遍历数组方法介绍”的全部内容。更多 JavaScript 学习请前往 w3cschool。

 
先看一段代码
Document
 
// 一个普通的数组
 
var arr =[3,5,2,6];
 
// 普通的for 循环遍历
 
for(var i = 0 ; i < arr.length; i++){
 
console.log(i,"类型："+typeof i,arr[i]);
 
}
 
// 用for in 遍历数组
 
for(var k in arr){
 
console.log(k,"类型："+typeof k,arr[k]);
 
}
 
这段代码显示出了 一点 for循环遍历数组 和for in 循环遍历 数组的一点区别：
 

 
标准的for循环中的i是number类型,表示的是数组的下标,但是foreach循环中的i表示的是数组的key是string类型。
 
这还不是坑，只是一点区别。
 
再看一段代码
Document
 
// 一个普通的数组
 
var arr =[3,5,2,6];
 
// 在数组原型上扩展一个方法
 
Array.prototype.extend = function(){
 
console.log("在数组原型扩展一个方法");
 
}
 
// 普通的for 循环遍历
 
for(var i = 0 ; i < arr.length; i++){
 
console.log(i,"类型："+typeof i,arr[i]);
 
}
 
// 用for in 遍历数组
 
for(var k in arr){
 
console.log(k,"类型："+typeof k,arr[k]);
 
}
 
这段代码就是在上边的代码的基础上，为Array做了一下扩充。很简单，只是添加了一个函数。但是我们来看运行会出现了什么情况：
 

 
输出的结果中，多出了一行，这一行就是我们扩展的一个函数，不是我们定义在数组中的值。到此这个问题就出来了。
 
综上所述，用for...in...在通常情况下确实可以正确运行。
 
但是如果我们在项目采用的是用foreach遍历数组，假设有一天谁不小心自己为了扩展js原生的Array类，或者引入一个外部的js框架也扩展了原生Array。那问题就来了。
 
所以最好还是用for循环遍历数组
 
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

1、js for循环 遍历对象属性
 

 
 
var person = {fname:"John",lname:"Doe",age:25};
 

 for (x in person) {
     console.log(x + "=" + person[x]);
 }
 
 

 
 
控制台输出结果：
 
fname=John
 lname=Doe
 age=25
 
 

 
 

 
 

 
 
2、js for循环 遍历数组
 
 

 
 
var mycars = new Array("Saab","Volvo","BMW");
 

 for (x in mycars){
     console.log(x + "=" + mycars[x])
 }
 
 

 
 
 
控制台输出结果：
 
0=Saab
 1=Volvo
 2=BMW
 

 
 
<script> 
//循环遍历数组 
var animals = ["cat",'dog','human','whale','seal']; 
var animalString = ""; 
for(var i = 0;i<animals.length;i++){ 
animalString += animals[i] + " "; 
} 
alert(animalString); //输出数组里的每个项
</script>