JS中filter的使用

最新推荐文章于 2024-08-24 09:28:24 发布

caiyan1225

最新推荐文章于 2024-08-24 09:28:24 发布

阅读量2.3k

点赞数 1

分类专栏：前端Vue相关学习文章标签： javascript vue.js es6

本文链接：https://blog.csdn.net/caiyan1225/article/details/115697910

版权

前端Vue相关学习专栏收录该内容

5 篇文章 0 订阅

订阅专栏

本文详细介绍了JavaScript中的filter方法，用于过滤数组元素。filter方法接收一个回调函数，返回值为true的元素会被保留，新数组不会改变原数组。示例中展示了如何利用filter筛选大于3的数以及去除数组重复元素。通过indexOf判断数组中元素的唯一性，实现去重功能。

摘要由CSDN通过智能技术生成

JS中filter的使用

filter方法是ES6新增的一种用来过滤的方法。可以用来迭代一个数组，并且按给出的条件过滤出符合的元素。
filter方法传入一个回调函数，这个回调函数会携带一个参数，参数为当前迭代的项。
回调函数返回true的项会保留在数组中，返回false的项会被过滤掉。（filter方法不会改变原数组）
filter方法传入两个参数filter(回调函数（数组中的每个元素都会执行这个回调函数），对象)

格式为：newArr=array.filter(function(item,index,arr), thisValue);
function(item,index,arr):回调函数，必传的参数，item为必须值，当前元素的值；index为可选值，当前元素的下标；arr为可选，当前元素属于的数组对象。
	数组中的每个元素都会执行这个回调函数，执行这个回调函数，当元素满足条件，再会被留下；不符合条件的元素会被过滤掉。
	返回一个由满足条件组成的新数组（filter方法不会改变原数组）
thisValue：可选，是一个对象，该对象作为该执行回调时使用，传递给函数，用作this的值。若省略了thisValue，this的值为undefinded。

例如：

let arr=[1,2,3,4,5,6];
let newArr=arr.filter(item=>{
	return item>=3;
}
console.log(newArr);// newArr=[3,4,5,6]

利用filter可以巧妙地去除Array的重复元素：

var  r;
var arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
r = arr.filter(function (element, index, self) {
	return self.indexOf(element) === index;
});
console.log(r.toString());//[apple,strawberry,banana,pear,orange]
注：去除重复元素依靠的是indexOf总是返回第一个元素的位置，后续的重复元素位置与indexOf返回的位置不相等，因此被filter滤掉了。