map和filter方法对于稀缺数组的处理

2024-04-02 08:20:26

稀缺数组

有一种数组叫稀缺数组，他的特点就是含有未赋值的索引。
比如：

let arr = [1]
arr.length = 10

这样一个数组长度为10，但是，除了第一位为1之外，其余的都是空，也就是使用了empty 字段占位。而map和filter作为最常用的数组方法之一，对于这种稀缺数组的处理是怎样的呢？

filter

任何问题首先看官方文档。

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

官方文档清晰的表示了filter对于稀缺数组的处理。那就是不会对稀缺数组里面的空值进行回调函数的调用，并且最终结果会自动排除空值，这其实可以算一个很好的在数组里面排除空值的方法。

map

我们只要注意官方文档的这样一句话：根据规范中定义的算法，如果被map调用的数组是离散的，新数组将也是离散的保持相同的索引为空。有人可能对离散表示疑惑，我们可以简单理解为就是稀缺数组，数组里面存在‘孔’，也就是空值（不是空字符串）。

var array = [1,,,2]
var mapArray = array.map((item, index) => {console.log(index)  //0, 3return item + 1;
})
// 方法执行是打印 0，3 似乎跳过了数组中 hole 元素
console.log(mapArray) //[2, empty × 2, 3]

经测试发现map方法是将空值直接跳过不进行运算（这里跟filter一直），但是会在最终结果保留空值（这里跟filter又不一致）。

补充

当然除了filter和map之外，还有一些数组方法也会遇到这些情况，这里分享一篇看到的文章，文章里还介绍了findIndex，find ，forEach ，reduce 这些方法对于稀缺数组的处理。
文章链接

总结

会直接跳过稀缺数组元素的方法：filter，reduce，foreach
不会直接跳过稀缺数组元素的方法：find，findIndex
会直接跳过稀缺数组元素但是结果会保留稀缺元素的方法：map

map和filter方法对于稀缺数组的处理相关推荐

Python之列表表达式及高阶函数lamda、zip、enumerate、map和filter方法
一.列表表达式[List Comprehension] 顾名思义,这个表达式作用是以一个快捷的方法对列表进行操作或运算,返回新的列表.其使用方式为[表达式 for 变量 in 列表] 或者 [表达式 ...
JS(ES5) 实现数组方法（迭代类型：evey、some、map、filter）的重构
重构前要理解这些方法的要干嘛.能干嘛,还有明白传入每个参数有什么用. 数组调用evey.some.map.filter方法中,传入的第一个参数是回调函数(必填),第二个参数是一个对象(可填.可不填), ...
js中数组filter过滤奇偶数_JS filter()方法：根据指定条件过滤数组元素
JavaScript filter() 方法可以返回数组中满足指定条件的元素.具体用法如下: array.filter(callbackfn[, thisArg]); 参数说明: array:必需参数 ...
数组filter方法对数组元素进行过滤
分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow 也欢迎大家转载本篇文章.分享知识,造福人民,实现我们中华民族伟大复兴! Arra ...
JavaScript 数组filter方法完整介绍
数组过滤器方法是 JavaScript 中使用最广泛的方法之一. 它允许我们快速过滤出具有特定条件的数组中的元素. 因此,在本文中,您将了解有关过滤器方法及其各种用例的所有内容. 所以让我们开始吧. ...
JavaScript基础 - 24 （数组方法：every、some、forEach、map、filter、reduce）
1.参数为回调函数,function(数组中的项目,序号,数组本身){ },至少接收一个项目(item.value)参数 ① every 数组中所有内容都满足回调函数的测试,返回值才为true,否则f ...
js 数组遍历方法详解（map、filter、find、findIndex、reduce）
目录前言 map map是什么 map方法的结构及入参语法糖 map一般不改变原数组 filter 说明例子 find 和 findIndex 说明例子 reduce 说明例子尾言前言 ...
前端利用js里数组的filter方法进行多条件过滤查询
需求:用户在输入框输入多个条件时,可以对表格数据进行过滤查询,无需后端接口处理,利用了前端js里数组的filter方法进行过滤. 如下是效果图: 当用户在姓名的输入框里输入"张"后 ...
如何拿到对象数组中的某一对象的元素（JS的filter方法）
如何拿到对象数组中的某一对象的元素在写一个简单的商品管理系统的时候,遇到了一个问题,我接口中需要传递的参数是一个role_id,但是我在页面上显示是角色名称通过对filter()方法的使用,拿到对 ...

最新文章

热门文章