上一篇博客讲到了数组的方法,当然里边比较复杂的就是数组的迭代方法,因为涉及到了回调函数,所以这篇博客我们来详细讲解一下js数组迭代方法的使用。 注意:forEach()方法不返回值,所以回调函数中使用return会打印出来undefined。 注意:map()方法有返回值,返回值为新的数组,所以可以直接再回调函数中return。 注意:every()方法所有的数组项都符合判断时返回true,否则返回false。 注意:some()方法如果回调函数执行完会根据结果返回true或false,但是回调函数中打印判断是,只会作为判断条件的返回值,则会打印多遍。 注意:filter()方法对数组项进行过滤,然后将符合条件的数组项添加到一个新的数组并返回,但是如果直接打印这个判断条件,相当于打印的判断条件的结果,只会返回true或者false。 1.find():返回第一个符合传入测试(函数)条件的数组元素。 2.findIndex():返回符合传入测试(函数)条件的数组元素索引。 3.includes():判断一个数组是否包含一个指定的值。 总结: 视频讲解链接:
JavaScript数组对象的迭代方法详解
1.forEach(funcrion(value,index,arr){}):对数组的每一项运行给定函数,这个方法不进行返回,所以一般用于让数组循环执行某方法。
var arr=[1,2,3,4,5,6]; arr.forEach(function(val,index,arr){ console.log(val,index,arr); }) // 其中: // value:每一个数组项的值 必填项 // index:每一个数组项对应的索引 // arr:当前的数组
2.map(funcrion(value,index,arr){}):对数组的每一项运行给定函数,它将返回执行函数后的结果组成的新数组。
var aNum2 = [1.2, 1.8, 2.0, 4.3]; console.log(aNum2.map(Math.floor()));// [1,1,2,4] var arr=[1,2,3]; console.log(arr.map(function(val,index){ return val*3 }));// 3 6 9 // 其中: // value:每一个数组项的值 必填项 // index:每一个数组项对应的索引 // arr:当前的数组
3.every(funcrion(value,index,arr){}):对数组的每一项都运行给定函数,进项判断,若对于每项执行函数都返回了true,则其结果为true。
var arr=[10,20,30]; console.log(arr.every(function(val){ return val>20; }));// false console.log(arr.every(function(val){ return val>0; }));// true // 其中: // value:每一个数组项的值 必填项 // index:每一个数组项对应的索引 // arr:当前的数组
4.some(funcrion(value,index,arr){}):对数组的每一项都运行给定函数,进行判断,若存在一项符合条件的数组项,则其结果为true。
var arr=[10,20,30]; console.log(arr.some(function(val){ return val>20; }));// true console.log(arr.some(function(val){ return val>0; }));// true console.log(arr.some(function(val){ return val<0; }));// false arr.some(function(val){ console.log(val<0); });//fasle false false // 其中: // value:每一个数组项的值 必填项 // index:每一个数组项对应的索引 // arr:当前的数组
5.fliter(funcrion(value,index,arr){}):对数组的每一项都运行给定函数,进行过滤,将符合条件的数组项添加到新的数组中,并返回新的数组。
var aNum=[1,2,3,4]; console.log(aNum.filter(function (num) { return num > 1; }));//[2,3,4,] aNum.filter(function (num) { console.log(num > 1);//true true true })
6.ES6中新增的迭代方法
var aNum=[10,20,30,40]; console.log(aNum.find(function (num) { return num > 19; }));//1 console.log(aNum.find(function (num) { return num < 0; }));//undefined
console.log(aNum.findIndex(function (num) { return num > 19; }));//3
console.log(aNum.includes(17));//false console.log(aNum.includes(20));//true
https://www.bilibili.com/video/BV1UQ4y1A73N/
本网页所有视频内容由 imoviebox边看边下-网页视频下载, iurlBox网页地址收藏管理器 下载并得到。
ImovieBox网页视频下载器 下载地址: ImovieBox网页视频下载器-最新版本下载
本文章由: imapbox邮箱云存储,邮箱网盘,ImageBox 图片批量下载器,网页图片批量下载专家,网页图片批量下载器,获取到文章图片,imoviebox网页视频批量下载器,下载视频内容,为您提供.
阅读和此文章类似的: 全球云计算