【JavaScript 数组迭代方法介绍用法实例】数组迭代方法对数组的每个元素执行一些操作。有一些不同的例子数组迭代方法如下。
Array.forEach()函数:的array.forEach()函数对数组的每个元素调用一次提供的函数(回调函数)。提供的函数是用户定义的, 它可以对数组执行任何类型的操作。
语法如下:
array.forEach(function callback(value, index, array){}[ThisArgument]);
参数:此函数接受上述和以下描述的三个参数:
- 值:这是函数正在处理的当前值。
- 指数:项索引是函数正在处理的当前元素的索引。
- 数组:调用.forEach()函数的数组。
<
!DOCTYPE html>
<
html >
<
head >
<
title >
JavaScript Array.forEach() function
<
/ title >
<
/ head >
<
body style = "text-align:center;
" >
<
h1 style = "color:green;
" >
lsbin
<
/ h1 >
<
h2 >
Array.forEach() method<
/ h2 >
<
p >
array.forEach() method Calls a function
once for every array element.
<
/ p >
<
p id = "GFG" >
<
/ p >
<
script >
var emptytxt = "";
var No = [23, 212, 9, 628, 22314];
No.forEach(itrtFunction);
document.getElementById("GFG").innerHTML = emptytxt;
function itrtFunction(value, index, array) {
emptytxt = emptytxt + value + "<
br >
";
}
<
/ script >
<
/ body >
<
/ html >
输出如下:
:
文章图片
Array.some()函数:array.some()函数检查数组的至少一个元素是否满足参数函数检查的条件。
语法如下:
array.some(arg_function(value, index, array), thisArg);
参数:此函数接受上述和以下描述的三个参数:
- 值:这是函数正在处理的当前值。
- 指数:项索引是函数正在处理的当前元素的索引。
- 数组:调用.some()函数的数组。
<
!DOCTYPE html>
<
html >
<
head >
<
title >
JavaScript Array.some() function
<
/ title >
<
/ head >
<
body style = "text-align:center;
" >
<
h1 style = "color:green;
" >
lsbin
<
/ h1 >
<
h2 >
Array.some() method<
/ h2 >
<
p >
some() method checks some array elements
validity according to the test condition.
<
/ p >
<
p id = "GFG" >
<
/ p >
<
script >
var numArray = [41, 2, 14, 29, 49];
var someOver50 = numArray.some(myFunction);
document.getElementById("GFG").innerHTML
= "Some values over 50 is " + someOver50;
function myFunction(value, index, array) {
return value >
50;
}
<
/ script >
<
/ body >
<
/ html >
输出如下:
如果array的任何一个值大于50:
文章图片
如果array的所有值都小于50:
文章图片
Array.map()函数:的array.map()函数通过在父数组中的每个项目上调用特定函数来创建数组, 并且它不会更改数组的值或元素。
语法如下:
array.map(function(value, index, array){}[ThisArgument]);
参数:此函数接受上述和以下描述的三个参数:
- 值:这是函数正在处理的当前值。
- 指数:项索引是函数正在处理的当前元素的索引。
- 数组:调用.mao()函数的数组。
<
!DOCTYPE html>
<
html >
<
head >
<
title >
JavaScript Array.map() function
<
/ title >
<
/ head >
<
body style = "text-align:center;
" >
<
h1 style = "color:green;
" >
lsbin
<
/ h1 >
<
h2 >
Array.map() method<
/ h2 >
<
p >
creates an array from calling a specific
function on each item in the parent array.
<
/ p >
<
p id = "GFG" >
<
/ p >
<
script >
var numArray = [1, 2, 3, 4];
var numArray2 = numArray.map(multiplyFunction);
document.getElementById("GFG").innerHTML = numArray2;
function multiplyFunction(value, index, array) {
return value + 100;
}
<
/ script >
<
/ body >
<
/ html >
输出如下:
文章图片
同样, Array.findIndex()方法, Array.find()方法, 数组lastIndexOf()函数, 数组indexOf()函数, 数组every()函数, array.reduceRight()函数, 数组reduce()方法和数组filter()函数是数组迭代器函数。
推荐阅读
- 分组密码和流密码之间的区别
- 2个VueJS实战开发实例
- VueJS响应接口用法详解
- VueJS渲染函数(render function)用法和原理详解
- VueJS混入mixins用法完全解读教程
- VueJS路由使用完全解读
- VueJS自定义指令和过滤器用法详解
- VueJS过渡和动画(transition & animation)使用详细教程
- VueJS渲染指令v-for、v-if、v-else、v-show用法详解