首页 > 其他分享> 文章详细

JS学习——数组迭代

2022-03-03 12:35:16 阅读：172 来源： 互联网

标签：myFunction 25 迭代 value JS numbers 数组 var

学习内容来源：JavaScript 数组迭代

JavaScript 数组迭代

注意：数组迭代方法对每个数组项进行操作。

Array.forEach()

forEach() 方法为每个数组元素调用一次函数（回调函数）。

回调函数接受 3 个参数：

项目值
项目索引
数组本身

例子：

// 这个例子将 txt 每次赋值为 txt + 项目值 + " * "， 得到 txt = "45 * 4 * 9 * 16 * 25 * "
var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value, index, array) {
  txt = txt + value + " * "; 
}

// 如果回调函数仅使用第一个参数（值）时，可以省略其他参数
var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value) {
  txt = txt + value + " * "; 
}

Array.map()

map() 方法通过对每个数组元素执行函数来创建新数组。
map() 方法不会对没有值的数组元素执行函数。
map() 方法不会更改原始数组。

回调函数有 3 个参数：

项目值
项目索引
数组本身

例子：

// 这个例子将每个数组值乘以2，得到 numbers2 = [90, 8, 18, 32, 50]
var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value, index, array) {
  return value * 2;
}

// 如果回调函数仅使用第一个参数（值）时，可以省略其他参数
var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value) {
  return value * 2;
}

Array.filter()

filter() 方法创建一个包含通过测试的数组元素的新数组。

回调函数接受 3 个参数：

项目值
项目索引
数组本身

例子：

// 这个例子将筛选出项目值大于 18 的元素，得到 over18 = [45, 25]
var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

// 如果回调函数仅使用第一个参数（值）时，可以省略其他参数
var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value) {
  return value > 18;
}

Array.reduce()

reduce() 方法在每个数组元素上运行函数，以生成（减少它）单个值。
reduce() 方法在数组中从左到右工作。
reduce() 方法不会减少原始数组。

回调函数接受 4 个参数：

总数（初始值/先前返回的值）
项目值
项目索引
数组本身

例子：

// 这个例子将数组的每个值相加，得到 sum = 99
var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value, index, array) {
  return total + value;
}

// 上例并未使用 index 和 array 参数。可以将它改写为
var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value) {
  return total + value;
}

// reduce() 方法能够接受一个初始值，得到 sum = 199
var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction, 100);

function myFunction(total, value) {
  return total + value;
}

补充：Array.reduceRight() 和 Array.reduce() 相似，区别在于该方法在数组中从右到左工作。

Array.every()

every() 方法检查所有数组值是否通过测试。

回调函数接受 3 个参数：

项目值
项目索引
数组本身

例子：

// 这个例子判断数组所有元素是不是都大于 18，的到 allOver18 = false
var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

// 如果回调函数仅使用第一个参数（值）时，可以省略其他参数
var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);

function myFunction(value) {
  return value > 18;
}

Array.some()

some() 方法检查某些数组值是否通过了测试。

回调函数接受 3 个参数：

项目值
项目索引
数组本身

例子：

// 这个例子判断数组中是否有元素大于 18，得到 someOver18 = true
var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

// 如果回调函数仅使用第一个参数（值）时，可以省略其他参数
var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);

function myFunction(value) {
  return value > 18;
}

Array.indexOf()

indexOf() 方法在数组中搜索元素值并返回其位置（索引）。
如果未找到项目，Array.indexOf() 返回 -1。
如果项目多次出现，则返回第一次出现的位置。

此函数接受 2 个参数：

要检索的项目
搜索位置（可选参数，负值将从结尾开始的给定位置开始，并搜索到结尾。）

例子：

// 这个例子查找数组中出现 "Apple" 的位置，数组中出现了两次 "Apple"，返回第一次出现的位置，得到 a = 0
var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");

// 给定搜索位置，没有找到得到 "Apple"，得到 a = -1
var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple", -1);

补充：Array.lastIndexOf() 与 Array.indexOf() 类似，但是从数组结尾开始搜索。

Array.find()

find() 方法返回通过测试函数的第一个数组元素的值。
没有通过测试函数的话返回 undefined。

回调函数接受 3 个参数：

项目值
项目索引
数组本身

例子：

// 这个例子返回数组中第一个大于 18 的元素，得到 first = 25
var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

// 如果回调函数仅使用第一个参数（值）时，可以省略其他参数
var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);

function myFunction(value) {
  return value > 18;
}

// 这个例子返回数组中第一个大于 30 的元素，没有大于 30 的元素，得到 first = undefined
var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);

function myFunction(value) {
  return value > 30;
}

Array.findIndex()

findIndex() 方法返回通过测试函数的第一个数组元素的索引。
没有通过测试函数的话返回 -1。

回调函数接受 3 个参数：

项目值
项目索引
数组本身

例子：

// 这个例子返回数组中第一个大于 18 元素索引，得到 first = 3
var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

// 如果回调函数仅使用第一个参数（值）时，可以省略其他参数
var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);

function myFunction(value) {
  return value > 18;
}

// 这个例子返回数组中第一个大于 30 元素索引，没有大于 30 的元素，得到 first = -1
var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);

function myFunction(value) {
  return value > 30;
}

标签：myFunction,25,迭代,value,JS,numbers,数组,var
来源： https://www.cnblogs.com/111K/p/15959175.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

JS学习——数组迭代

JavaScript 数组迭代

Array.forEach()

Array.map()

Array.filter()

Array.reduce()

Array.every()

Array.some()

Array.indexOf()

Array.find()

Array.findIndex()