JavaScript手册 | JS Array 对象中的filter()方法

作者: Arvin Chen 分类: js 来源: Break易站(www.breakyizhan.com)

JS Array 对象中的filter()方法的定义和用法

Array.filter()方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

JS Array 对象中的filter()方法浏览器的兼容性

方法 Chrome Inter Explorer Firefox Safari Opera
filter() YES YES YES YES YES

JS Array 对象中的filter()方法的语法和例子

Array filter()方法的语法:

var newArray = arr.filter(callback[, thisArg])

参数
callback用来测试数组的每个元素的函数。返回true表示保留该元素(通过测试);false则不保留,取三个参数:

element正在数组中处理的当前元素。

index数组中正在处理的元素的索引。

array数组filter被调用。

thisArg Optional可选的。

this执行时使用的值callback。

返回值
一个新的通过测试的元素的集合的数组。

描述
filter为数组中的每个元素调用一次 callback函数,并利用所有使得callback返回 true 或 等价于 true 的值 的元素创建一个新数组。callback 只会在已经赋值的索引上被调用,对于那些已经被删除或者从未被赋值的索引不会被调用。那些没有通过 callback测试的元素会被跳过,不会被包含在新数组中。

callback被调用时传入三个参数:

元素的值
元素的索引
被遍历的数组
如果为filter提供一个 thisArg 参数,则它会被作为callback被调用时的this值。否则,callback的this值在非严格模式下将是全局对象,严格模式下为undefined。

filter不会改变原数组。

filter 遍历的元素范围在第一次调用callback之前就已经确定了。在调用filter之后被添加到数组中的元素不会被filter遍历到。如果已经存在的元素被改变了,则他们传入callback的值是filter遍历到它们那一刻的值。被删除或从来未被赋值的元素不会被遍历到。

js array使用filter()获取数组不被2整除的元素

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js array使用filter()获取数组不被2整除的元素 - Break易站(breakyizhan.com)</title>
</head>
<body>

<p>点击按钮获取数组不被2整除的元素</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
var ages = [56, 91, 18, 88, 12];
function checkisodd(age) {
    return (age % 2 == 1);
}
function myFunction() {
    document.getElementById("demo").innerHTML = ages.filter(checkisodd);
}
</script>

</body>
</html>

尝试一下 >>

js array使用filter()返回数组 ages 中所有元素都大于输入框指定数值的元素

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js array使用filter()返回数组 ages 中所有元素都大于输入框指定数值的元素 - Break易站(breakyizhan.com)</title>
</head>
<body>

<p>点击按钮返回数组 ages 中所有元素都大于输入框指定数值的元素。</p>
<p>最小年龄: <input type="number" id="ageToCheck" value="30"></p>
<button onclick="myFunction()">点我</button>
<p>所有大于指定数组的元素有? <span id="demo"></span></p>
<script>
var ages = [55, 77, 18, 90];
function checkAdult(age) {
    return age >= document.getElementById("ageToCheck").value;
}
function myFunction() {
    document.getElementById("demo").innerHTML = ages.filter(checkAdult);
}
</script>

</body>
</html>

尝试一下 >>
 

  •   本文标题:JavaScript手册 | JS Array 对象中的filter()方法 - Break易站
    转载请保留页面地址:https://www.breakyizhan.com/js/6757.html
    扫描二维码添加微信 
  • ,领取淘宝优惠券,淘宝购物更优惠。现在添加微信,还可以领取机械键盘优惠券!添加微信后,分享淘宝选中的机械键盘给淘宝机器人即可领取!
    支持我们,就用微信淘宝!

    发表笔记

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

    更多阅读