JavaScript中利用for循环遍历数组

这篇文章主要为大家详细介绍了JavaScript中利用for循环遍历数组，最好不要使用for in遍历，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

先看一段代码

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

</head>

<body>

<script>

// 一个普通的数组

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]);

}

</script>

</body>

</html>

这段代码显示出了一点 for循环遍历数组和for in 循环遍历数组的一点区别：

标准的for循环中的i是number类型,表示的是数组的下标,但是foreach循环中的i表示的是数组的key是string类型。

这还不是坑，只是一点区别。

再看一段代码

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

</head>

<body>

<script>

// 一个普通的数组

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]);

}

</script>

</body>

</html>

这段代码就是在上边的代码的基础上，为Array做了一下扩充。很简单，只是添加了一个函数。但是我们来看运行会出现了什么情况：

输出的结果中，多出了一行，这一行就是我们扩展的一个函数，不是我们定义在数组中的值。到此这个问题就出来了。

综上所述，用for...in...在通常情况下确实可以正确运行。

但是如果我们在项目采用的是用foreach遍历数组，假设有一天谁不小心自己为了扩展js原生的Array类，或者引入一个外部的js框架也扩展了原生Array。那问题就来了。

所以最好还是用for循环遍历数组

以上就是本文的全部内容，希望对大家的学习有所帮助。

转自：https://www.weidianyuedu.com

JavaScript中利用for循环遍历数组相关推荐

html页面遍历数组,JavaScript中利用for循环遍历数组
先看一段代码 Document // 一个普通的数组 var arr =[3,5,2,6]; // 普通的for 循环遍历 for(var i = 0 ; i < arr.length; i++ ...
【Linux】Shell脚本中如何使用“循环”遍历“数组”中的元素（包括MySQL的常用指令介绍）
一.背景实习过程中,今天mentor突然让我拉取一下远端园区数据库中的部分信息,因为包含很多不同园区的数据信息,而且要以园区为单位生成文件来对数据进行存放,因此自然是需要使用shell脚本来自动生成 ...
JavaScript 循环遍历数组的11种方法
本教程解释了如何在 JavaScript 中循环遍历数组.根据我们的用例和代码的速度/效率,我们可以使用 Vanilla JavaScript 中的传统方法(如for循环和while循环)或使用 ES ...
Vue 中利用 template标签遍历多维数组
Vue 中利用 template标签遍历多维数组 1. 需求 2. 二维数组内容 3. 列表渲染指令 v-for 4. template 标签 5. 正确的做法作者:高玉涵时间:2022.7.20 ...
JS中循环遍历数组的四种方式总结
1.for 循环: for (let index=0; index < someArray.length; index++) {const elem = someArray[index];// ...
JavaScript中for..in循环陷阱介绍
for...in循环中的循环计数器是字符串,而不是数字它包含当前属性的名称或当前数组元素的索引,下面有个不错的示例大家可以参考下大家都知道在JavaScript中提供了两种方式迭代对象: (1)f ...
php for循环in的用法,JavaScript中for in循环是如何使用的？需要注意些什么？
大家都知道在JavaScript中提供了两种方式迭代对象: (1)for 循环: (2)for..in循环: 使用for循环进行迭代数组对象,想必大家都已经司空见惯了.但是,使用for.. in循环时 ...
python循环展示大写字母_python调用大写函数python中字典的循环遍历的两种方式
开发中经常会用到对于字典.列表等数据的循环遍历,但是python中对于字典的遍历对于很多初学者来讲非常陌生,今天就来讲一下python中字典的循环遍历的两种方式. 注意: python2和python ...
foreach循环遍历数组方法vue介绍
在vue中用foreach循环遍历数组全部元素,利用回调函数对数组进行操作,自动遍历整个数组,且无法break中途跳出循环,不可控,不支持return操作输出,return只用于控制循环是否跳出当前循 ...

JavaScript中利用for循环遍历数组

JavaScript中利用for循环遍历数组相关推荐

最新文章

热门文章