javascript array的map forEach every filter reduce

map

var a = [1,3,6,4,5];
var new_array = a.map(function(value, index, array){
    console.log(value, index, array);
    return value;
})

跑一遍就知道了,上手敲,不要复制粘贴
map接收一个函数,然后新数组的每个元素是这个函数的返回值
这个函数接收三个参数,第一个是当前元素,第二个是当前元素的索引,第三个是当前数组;
这样子,看着好像没有实际用到的,举个例子

var links = [];
$('ul').map(function(value){
    links.push($(value).find('a').href);
})
console.log(links.join("\n"));

在某个资源站,下载电视剧,一个一个复制是不是很烦呐,将上面的代码改一改,控制台里走一走,链接全部出来了,就问你爽不爽😁

forEach
forEach的第一个参数也是个函数,也接收三个参数,这个参数和map一样,不过,它没有返回值,所以也就没有新数组产生
上面找资源链接的代码也可以用forEach去写,因为我们的目的是一致的,
都遍历数组,然后找到链接后加入数组,最后显示所有链接
第二个是可选参数,用作this, 在第一个函数里面可以用this,影响外部的对象,在某些时候还是很有用的,比如
不用再 var that = this;
然后在闭包里面用that了😂….

every
这个方法和上一个一样,参数列表一样,传的函数的参数也一样
不过,返回值是布尔,检验每个元素是否通过了传入的函数的测试,因为遍历了数组,所以我们还是可以用它整理资源😁

filter
这个方法也和上一个一样,检验每个元素,不过不同的是,通过测试的元素,会组成一个新的数组,返回值就是这个数组

reduce
这货也接收一个函数作为参数,官方举的例子很直接,就是从左到右应用那个函数,最后返回函数累计计算的结果
咱们能不能用它来处理电视剧资源链接呢😂,答案是可以的

$('ul').reduce(function(link, value, index, array){
    return link + "\n" + $(value).find('a').href;
})

嗯,如果 $(‘ul’)没有reduce方法,可以.toArray(),再调用reduce
发现了没,这个函数接收四个参数,第一个很特殊,它就是上次调用这个函数的返回值,
reduceRight 和上面那个哥们一样的,不过处理的顺序相反
//课外知识点 递归 迭代

循环数组的方法还有几个,sort,some,find,findIndex…待续

发布者

gt

QQ: 1520667045 一个名叫坏人的博客,他很想成为WEB攻城狮,因为他认为每个前端开发者的审美观都是很挑的……

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据