继续数组方法,今天应该到filter了。
filter:filter()
方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
使用:
var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; const result = words.filter(word => word.length > 6); console.log(result);
从示例中看,也就是说,需要过滤出来元素的单词长度大于6的所有元素。
查看一下结果呢!
语法:
var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])
filter有两个参数,第一个就是回调函数,第二个参数与之前我们说到的some、every啊类似,基本上就就是数组函数只要提供了回调函数,都会有这么一个用于执行callback回调的this值。
回调函数也是三个参数,就没什么可说的了,数组函数的所有回调函数都是这三个参数:元素element、索引index、数组本身array。
来吧,开始重构:function filter(arr, fn, thisArg) { if (!(arr instanceof Array)) throw new Error("请确保第一个参数类型为数组") var results = [] for (var i = 0; i < arr.length; i++) { if (fn.call(thisArg, arr[i], i, arr)) results[results.length] = arr[i] } return results }
是不是也真的没什么好神奇的?
find:find()
方法返回数组中满足提供的测试函数的第一个元素的值。否则返回undefined
。
使用:
var array1 = [5, 12, 8, 130, 44]; var found = array1.find(function(element) { return element > 10; }); console.log(found);
其实依据我们之前介绍其他的数组方法所说的,很容易理解到,find方法也是提供一个回调函数,那么必然也有一个可选的用于回调函数的this值,他查找并返回的是第一个符合回调函数测试结果的元素。其他的并没有什么特殊之处。
function find(arr, fn, thisArg) { if (!(arr instanceof Array)) throw new Error("请确保第一个参数类型为数组") for (var i = 0; i < arr.length; i++) { if (fn.call(thisArg, arr[i], i, arr)) { return arr[i] } } return undefined }
说到这里,自然而然的可以预料到,下一个函数必然是findIndex了,从字面上就可以理解到findIndex是干什么的了!而且有find在前,findIndex也真的没什么好说的了。
findIndex:findIndex()
方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。
简单说一下,find返回的是数组符合回调测试条件的第一个元素,findIndex返回的是符合回调测试条件的第一个元素的索引。
function findIndex(arr, fn, thisArg) { if (!(arr instanceof Array)) throw new Error("请确保第一个参数类型为数组") for (var i = 0; i < arr.length; i++) { if (fn(thisArg, arr[i], i, arr)) { return i } } return -1 }
看这两个重构的函数都没有他打区别,也就是一个元素,一个索引值而已。