Heim > Web-Frontend > js-Tutorial > So durchlaufen Sie Arrays in JavaScript

So durchlaufen Sie Arrays in JavaScript

青灯夜游
Freigeben: 2021-10-25 15:29:26
Original
25753 Leute haben es durchsucht

JavaScript中遍历数组的方法:1、使用for循环语句;2、使用forEach()方法调用回调函数;3、使用map()方法调用回调函数;4、使用“for..in”循环语句;5、使用“for…of”循环语句。

So durchlaufen Sie Arrays in JavaScript

本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

在使用 JavaScript 编写代码过程中,可以使用多个方法对数组进行遍历;包括 for循环、forEach循环、map 循环、forIn循环和forOf循环等方法。

一、for 循环:基础、简单

这是最基础和常用的遍历数组的方法;各种开发语言一般都支持这种方法。

let arr = ['a','b','c','d','e'];
for (let i = 0, len = arr.length; i < len; i++) {
  console.log(i);    // 0 1 2 3 4
  console.log(arr[i]); //a b c d e
}
Nach dem Login kopieren

二、forEach() 方法:使用回调函数

forEach() 这是数组对象的一个方法;其接受一个回调函数为参数。
回调函数中有三个参数:

  • 1st:数组元素(必选)
  • 2nd:数组元素索引值(可选)
  • 3rd:数组本身(可选)
let arr = [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,&#39;d&#39;,&#39;e&#39;];
arr.forEach((item,index,arr)=> {
  console.log(item);  // a b c d e 
  console.log(index); // 0 1 2 3 4
  console.log(arr);  // [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,&#39;d&#39;,&#39;e&#39;]
})
Nach dem Login kopieren

三、map() 方法:使用回调函数

其使用方式和 forEach() 方法相同。

var arr = [
  {name:&#39;a&#39;,age:&#39;18&#39;},
  {name:&#39;b&#39;,age:&#39;19&#39;},
  {name:&#39;c&#39;,age:&#39;20&#39;}
];
arr.map(function(item,index) {
  if(item.name == &#39;b&#39;) {
    console.log(index) // 1
  }
})
Nach dem Login kopieren

四、for..in 循环:遍历对象和数组

for…in循环可用于循环对象和数组。
推荐用于循环对象,也可以用来遍历json。

let obj = {
  name: &#39;王大锤&#39;,
  age: &#39;18&#39;,
  weight: &#39;70kg&#39;
}
for(var key in obj) {
  console.log(key);    // name age weight
  console.log(obj[key]); // 王大锤 18 70kg
}
----------------------------
let arr = [&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,&#39;d&#39;,&#39;e&#39;];
for(var key in arr) {
  console.log(key); // 0 1 2 3 4 返回数组索引
  console.log(arr[key]) // a b c d e
}
Nach dem Login kopieren

五、for…of 循环:遍历对象和数组

可循环数组和对象,推荐用于遍历数组。

for…of提供了三个新方法:

  • key()是对键名的遍历;
  • value()是对键值的遍历;
  • entries()是对键值对的遍历;
let arr = [&#39;科大讯飞&#39;, &#39;政法BG&#39;, &#39;前端开发&#39;];
for (let item of arr) { 
 console.log(item); // 科大讯飞 政法BG 前端开发
}
// 输出数组索引
for (let item of arr.keys()) { 
 console.log(item); // 0 1 2
}
// 输出内容和索引
for (let [item, val] of arr.entries()) { 
 console.log(item + &#39;:&#39; + val); // 0:科大讯飞 1:政法BG 2:前端开发
}
Nach dem Login kopieren

六、补充

6.1、break 和 Continue 问题

forEach、map、filter、reduce、every、some 函数中 break continue 关键词都会不生效,因为是在function中,但function解决了闭包陷阱的问题。

要想使用 break、continue 可以使用 for、for...in、for...of、while

6.2、数组和对象

用于遍历数组元素使用:for(),forEach(),map(),for...of

用于循环对象属性使用:for...in

【推荐学习:javascript高级教程

Das obige ist der detaillierte Inhalt vonSo durchlaufen Sie Arrays in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage