从一个数组中根据条件过滤得到一个新的数组

向右看齐 2022-11-04 11:25 195阅读 0赞

> 积跬步 至千里

# [Array.prototype.filter()][Array.prototype.filter] #

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

# 需求：自定义table穿梭框，数据左右切换时，左侧的数据顺序保持不变 #

### 思路：左侧数据+右侧数据 = 所有数据 ，保持顺序不变 准备一个所有数据的数组，每次右侧删除变动，可以右侧删除后， ###

### 左侧数据 = 所有数据.filter（右侧数据）,这样会保持原来的数据顺序不变 ###

###  ###

# 代码示例 关键代码 #

**let tableData = allData.filter(item => !selectedData.some(sel => item.no === sel.no))**

let allData = [{
                name: 'aaa',
                age: 18,
                no: 1
            }, {
                name: 'bbb',
                age: 17,
                no: 2
            }, {
                name: 'ccc',
                age: 15,
                no: 3
            }, {
                name: 'ddd',
                age: 12,
                no: 4
            }, {
                name: 'eee',
                age: 8,
                no: 5
            }, {
                name: 'fff',
                age: 16,
                no: 6
            }]
    
            let selectedData = [{
                name: 'eee',
                age: 8,
                no: 5
            }, {
                name: 'ccc',
                age: 15,
                no: 3
            }, ]
    
            let tableData = allData.filter(item => !selectedData.some(sel => item.no === sel.no))
            console.log(tableData)

> 业精于勤 荒于嬉

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1NhbmR5X3poaQ_size_16_color_FFFFFF_t_70][]

[Array.prototype.filter]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1NhbmR5X3poaQ_size_16_color_FFFFFF_t_70]: /images/20221023/0def28e2a2fc4f52ae24b45f10878d6d.png