JS 数组根据字段或者数组下标过滤数组的数据(fiter)

最新推荐文章于 2024-05-16 10:10:00 发布

半夏不会前端

最新推荐文章于 2024-05-16 10:10:00 发布

阅读量3.4k

点赞数 1

文章标签： javascript 前端

本文链接：https://blog.youkuaiyun.com/weixin_43963525/article/details/122217094

版权

JS 数组根据字段或者数组下标过滤数组的数据(fiter)

使用数组的fiter很方便可以根据字段type进行筛选
```javascript
const newData = [
            {
                details: "尊敬的用户，欢迎您成为xxx平台会员。",
                id: 55,
                member_id: 19,
                source: "系统消息",
                status: 1,
                title: "注册成功",
                type: "重要通知",
            },
            {
                details: "尊敬的用户，请完善信息获得更多功能权限。",
                id: 55,
                member_id: 19,
                source: "系统消息",
                status: 1,
                title: "注册成功",
                type: "重要通知",
            },
            {
                details: "您的订单xxx已经发货！",
                id: 55,
                member_id: 19,
                source: "系统消息",
                status: 1,
                title: "注册成功",
                type: "订单消息",
            }
        ]

//过滤了 type=订单消息的数据
const noticeFiter= newData.filter(item => item.type === '重要通知')
//在上面过滤的基础上，过滤数组下标大于0的数据，相当于只取第一条
const noticeData=noticeFiter.filter((item,index)=> index<=0)
//过滤了 type=重要通知的数据
const orderData = newData.filter(item => item.type === '订单消息')

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

半夏不会前端

关注关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

js 数组常用方法(归类总结)

qq_42714578的博客

12-04

924

一、 js 数组字符串常用方法 1、数组转换为字符串使用 arr.join() let arr=[1, 2, 3, 4, 5, 6, 7, 8, 9] arr.join() // "1,2,3,4,5,6,7,8,9" 2、字符串转为数组使用 str.split(’’) let str='123456789' str.split() // ["1", "2", "3", "4", ...

WPS JS宏编程教程（从基础到进阶）-- 第五部分：JS数组与WPS结合应用

石头的博客

04-08

1703

本章深入探讨了 JavaScript 数组在 WPS 表格自动化中的高级应用，旨在帮助读者掌握数组操作的核心技巧，轻松处理复杂数据并提升工作效率。通过详细的代码示例和逐行解析，本章内容涵盖了数组的归并、打平、合并、切片、排序以及综合应用等多个方面。

参与评论您还未登录，请先登录后发表或查看评论

js数组依据下标删除元素

12-02

1、创建数组代码如下: var array = new Array(); var array = new Array(size);//指定数组的长度 var array = new Array(item1,item2……itemN);//创建数组并赋值 2、取值、赋值代码如下: var item = array[index];//获取指定元素的值 array[index] = value;//为指定元素赋值 3、添加新元素代码如下: array.push(item1,item2……itemN);//将一个或多个元素加入数组，返回新数组的长度 array.unshift(item

js 数组过滤指定参数

Hanx_的博客

05-16

622

用filter：arr.filter((item) => item.id!后面的意思是：过滤出来id不等于2的数组，就相当于把id等于2的过滤出去了。

js中使用filter函数过滤数组

lamwolf的博客

06-30

9047

【代码】js中使用filter函数过滤数组。

js中过滤指定字符

zw1_csdn的博客

09-07

9936

1、场景：在页面跳转中需要获取URL中id的值，但是跳转过程中会出现id值后面有个“#” 其中，#代表网页中的一个位置。其右面的字符，就是该位置的标识符。比如，http://www.example.com/index.html#print就代表网页index.html的print位置。浏览器读取这个URL后，会自动将print位置滚动至可视区域。为网页位置指定标识符，有...

【JS】使用filter过滤

zeroming的博客

05-09

1084

filter filter也是一个常用的操作，它用于把Array的某些元素过滤掉，然后返回剩下的元素。和map()类似，Array的filter()也接收一个函数。和map()不同的是，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素。例如，在一个Array中，删掉偶数，只保留奇数，可以这么写： var arr = [1, 2, 4, 5, 6, 9, 10, 15]; var r = arr.filter(function (x) {

数组去重的几种方法

m0_46394390的博客

03-10

721

数组去重的几种常见方法 1. 简单的去重方法 filter()+indexOf() filter()数组方法可接收三个参数，第一个:当前元素的值，第二个:当前元素的下标，第三个:当前元素属于的数组对象 indexOf() 方法可返回数组中某个指定的元素位置。 //思路：主要利用filter()方法过滤掉重复元素 var arr=[1,1,2,3,3,4,5,5,5] //需要去重的数组 //过滤掉...

在一个数组中，如果数组某个下标中的tourername等于`报名人${该下标+1}`（例如arr[0].tourername == `报名人${0+1}`）,那么久删除该下标这个tourername，实现代码

09-14

因此，一般我们会采用创建一个新数组的方式来实现删除操作，或者使用标记删除的方式来避免下标错位的问题。由于您的问题没有指定编程语言，我将以JavaScript为例进行解答，因为它是一种轻量级且广泛使用于前端开发...

uniapp 笔记第三天(修改数组对象的某个值、watch、computed)

m0_61389631的博客

08-03

5213

我们想呢点击哪个按钮就让谁切换它的状态,看上面的数据哈每一项都有一个status 你就可以根据索引拿到当前的状态赋值做法就是取反哈！，原因是简单数据类型没有地址的概念现在修改的num是一个简单数据类型传过来的 num 并非data里定义的 num 传过来的只是值而已。，原因就是传过来的对象和data里面定义的对象指向的都是同一个地址，所以可以修改，如果你去定义一个简单的数据类型。如果你想直接修改复杂数据类型里的某个值也是同理，我们既然可以拿到上面的索引直接根据索引找某个值就好了。...

查找数组某个元素的下标

热门推荐

king110108的专栏

06-07

1万+

昨天写了个程序查找数组元素的下标。折腾了好久才弄出来，自己写出来总结一下。如果要查找某个元素的下标，我们必须知道这个元素的值val是多少，然后要知道数组的首地址pst，和数组的总元素个数len。我们从右往左依次查询数组元素的值看是否等于val，如果等于val就返回该下标，不等于就继续查询。这里涉及到递归算法，实际就是如果查最后一个元素是否我们所查询的值，如果是我们输出len-1就为该值的下标，

JavaScript中filter函数使用

qq_46336539的博客

05-19

772

filter的使用方法，应用 filter用于对数组进行过滤,可创建一个新数组，新数组中的元素是通过检查指定数组中符合条件的元素利用filter去除数组中重复元素，不会改变原数组

js 工具类查找数组删除数组返回数组下标

u011747401的博客

05-11

798

项目中用的数组操作： var hasOwnProperty = Object.prototype.hasOwnProperty; var Utils = cc.Class({ extends: cc.Component, properties: { }, statics: { instance: null }, /**

JS使用filter过滤二维数组 (亲测可用)

qq_40137978的博客

01-27

3958

数组结构如下 let data = [{ a:123, arr:[{b:true},{b:false}] }, { a:234, arr:[{b:true},{b:false}] }] 要过滤掉arr数组里的b为false的值使用forEach+filter let newArr = [ ]; data.forEach((value,index) => { newArr[index] = value; newArr[index].arr = v

JavaScript findIndex查找下标

Myqqlady的博客

09-25

1063

今天在处理一个bug的时候找到了这个方法简直太优秀了必须收藏起来 findIndex 用法如下 var array = [1,2,3,'4']; var indexOf4 = (array || []).findIndex((item) => item === '4'); console.log(indexOf4); // 3 var profiles= [ { id: 'id123', name: "lin", age: 23 },

JavaScript中常用的数组过滤方法

weixin_53156345的博客

09-20

6039

在 JavaScript 编程中，经常会遇到需要对数组进行筛选和过滤的情况。本文将介绍几种常用的数组过滤方法，帮助你在处理数组数据时更加灵活高效。

数组的filter方法，数组过滤方法

super帅的博客

03-15

6099

// 数组的filter方法 // 返回满足条件的新数组（是返回新数组，不是修改原数组） // 例子：删除数组中 id 为 1 的元素 // 分析：用filter把 id 不等于 1 的数据过滤出来 let arr = [{ id: 1, name: "张三" }, { id: 2, name: "李四" }, { id: 3, name: "王五" }] let newarr = arr.filter(item => item.id !== 1) // item 为当前数组的每一项.

Python numpy使用记录3.数组元素筛选，np.where

qq_41035283的博客

04-11

9867

Python numpy使用记录3.数组筛选切片，np.where前言np.where的使用1.筛选替换2.筛选提取前言如果我想提取数组中大于某个阈值的所有元素，可以使用数组筛选后提取。本篇记录数组筛选的方法，np.where np.where的使用 np.where是numpy中用于元素筛选的函数，有两种使用方法。 1.筛选替换函数原型：np.where(condition, x, y)，condition表示数组与筛选条件，x表示满足条件的替换值，y表示不满足条件的替换值，函数返回替换矩阵（同维

（美团）巧用数组下标，轻轻松松找出所有元素

程序员吴师兄的博客

09-16

479

大家好，我是吴师兄。今天分享的算法题和数组这个数据结构有关，如果你不了解数组的特点，你百分百无法想到它的解法。题目描述给定一个整数数组 a，其中 1 ≤ a[i] ≤ n （n为数...

js 数组根据某个字段降序

最新发布

05-09

<think>好的，用户现在想对JavaScript数组按某个字段进行降序排序。我需要回顾之前的对话和相关引用，提供准确的方法。首先，用户之前的问题是关于在React中使用useModal处理字符串换行，但现在转向了JavaScript数组排序。不过根据用户提供的引用，他们之前已经分享了几种排序方法，包括原生JavaScript和Lodash的实现。现在用户明确要求按字段降序排列。我需要先确定用户是否了解原生方法，或者是否需要更简洁的封装函数。引用1中的arrObjSort函数已经是一个封装好的例子，可以处理升序和降序，但用户可能只需要降序部分。引用2展示了简单数组的降序，而引用4则是对象数组按字段降序的例子。引用3提到了Lodash的orderBy方法，适合更复杂的排序需求。用户可能需要多种方法的选择，比如原生实现、封装函数，或者使用Lodash库。需要分点说明，确保清晰。同时，用户可能关心是否会修改原数组，因为sort方法会改变原数组，这点需要提醒。另外，是否需要深拷贝来避免副作用也是一个注意点。还要考虑用户是否对性能有要求，或者是否需要处理非数值字段的情况，比如字符串比较。不过根据引用中的例子，多数处理的是数值，可能需要指出如果字段是字符串，应该用localeCompare。最后，确保回答结构清晰，步骤明确，并给出注意事项，比如引用中的安全验证和兼容性问题可能不适用，但修改原数组和深拷贝是相关的。需要总结不同方法的适用场景，帮助用户选择最合适的方案。</think>在 JavaScript 中实现数组按字段降序排序主要有三种方法，以下是具体实现和对比分析： --- ### 方法一：原生 `sort()` 方法（推荐）直接使用数组的 `sort()` 方法配合自定义比较函数： ```javascript const data = [ { name: "香蕉", num: 1 }, { name: "苹果", num: 4 }, { name: "葡萄", num: 3 }, { name: "草莓", num: 2 }, { name: "芒果", num: 5 } ]; // 按 num 字段降序排序（会修改原数组） data.sort((a, b) => b.num - a.num); console.log(data); // 输出结果： // [{name:"芒果",num:5}, {name:"苹果",num:4}, {name:"葡萄",num:3}, ...] ``` --- ### 方法二：封装可复用函数（参考引用[1]）创建通用排序函数，支持动态指定字段和排序方向： ```javascript /** * @desc 数组对象排序（会修改原数组） * @param {Array} arrObj - 目标数组 * @param {string} column - 排序字段 * @param {string} order - 排序方向 (asc/desc) */ function arrObjSort(arrObj, column, order = 'desc') { const sortOrder = order.toLowerCase() === 'asc' ? 1 : -1; arrObj.sort((a, b) => sortOrder * (Number(b[column]) - Number(a[column])) ); } // 使用示例 arrObjSort(data, 'num'); ``` --- ### 方法三：使用 Lodash（适合复杂场景，参考引用[3]）通过 Lodash 的 `orderBy` 实现更灵活的排序： ```javascript import _ from 'lodash'; const sortedData = _.orderBy( data, // 原始数组 ['num'], // 排序字段 ['desc'] // 排序方向 ); ``` --- ### 对比分析 | 方法 | 优点 | 缺点 | 适用场景 | |------------|-------------------------------|----------------------------|-----------------------| | 原生方法 | 无需依赖库，性能最佳 | 会修改原数组 | 简单字段排序 | | 封装函数 | 可复用，支持动态配置 | 需要自行处理类型转换 | 需要重复调用的场景 | | Lodash | 支持多字段/多方向排序 | 需要引入第三方库 | 复杂排序需求 | --- ### 注意事项 1. **副作用问题**：`sort()` 方法会直接修改原数组，建议先拷贝： ```javascript const sorted = [...data].sort((a, b) => b.num - a.num); ``` 2. **非数值字段处理**：若字段值为字符串，需改用字符串比较： ```javascript data.sort((a, b) => b.name.localeCompare(a.name)); ``` 3. **空值处理**：建议增加空值判断逻辑（参考引用[1]的数值转换处理） --- ### 性能测试示例 ```javascript const bigData = Array(1e5).fill().map(() => ({ num: Math.floor(Math.random() * 1000) })); console.time('原生排序'); [...bigData].sort((a, b) => b.num - a.num); console.timeEnd('原生排序'); // 约 45ms (测试环境：Chrome 118) ``` ---