Skip to content

thundermiracle/filter-data

Folders and files

NameName
Last commit message
Last commit date
Jan 31, 2025
Apr 27, 2024
Apr 27, 2024
Aug 14, 2023
Jun 3, 2022
Aug 14, 2023
Dec 8, 2019
Jun 13, 2023
Jul 12, 2023
Jun 10, 2023
Apr 27, 2024
Dec 8, 2019
Sep 1, 2024
Dec 8, 2019
Jun 4, 2022
Jun 3, 2022
Jan 31, 2025
Jan 31, 2025
Jun 14, 2022
Jun 13, 2023
Feb 27, 2020
Jun 13, 2023

Repository files navigation

filter-data

npm version dependencies Status CircleCI codecov

Description

Simple but fast data filter.

Examples

  1. Example In Browser
  2. Example In React

Benchmark

100 Records(ms)

*The results are little different in partial search.

match-sorter (6.3.1) fuse.js (6.6.2) filter-data (0.2.0)
match all, 1 key 10.947ms 4.244ms 1.827ms
no match, 1 key 0.523ms 2.385ms 2.958ms
match partial, 1 key 0.232ms 0.318ms 2.475ms
match all, 2 keys 1.472ms 0.465ms 2.209ms
no match, 2 keys 0.188ms 0.513ms 2.522ms
match partial, 2 keys 0.191ms 0.318ms 2.475ms
match all, 1 key, slice(0,10) 0.192ms 0.206ms 0.388ms
no match, 1 key, slice(0,10) 0.101ms 0.317ms 0.079ms
match partial, 1 key, slice(0,10) 0.107ms 0.188ms 2.807ms
input empty 0.114ms 0.095ms 0.033ms

10000 Records(ms)

*The results are little different in partial search.

match-sorter (4.0.2) fuse.js (3.4.6) filter-data (0.2.0)
match all, 1 key 21.439ms 49.336ms 16.884ms
no match, 1 key 18.239ms 33.312ms 6.382ms
match partial, 1 key 18.754ms 22.56ms 3.805ms
match all, 2 keys 22.815ms 22.524ms 10.416ms
no match, 2 keys 18.096ms 33.232ms 3.744ms
match partial, 2 keys 16.821ms 27.052ms 3.094ms
match all, 1 key, slice(0,10) 10.614ms 12.692ms 0.106ms
no match, 1 key, slice(0,10) 9.808ms 19.709ms 0.111ms
match partial, 1 key, slice(0,10) 9.593ms 16.094ms 0.393ms
input empty 10.571ms 6.985ms 0.03ms

Install From Browser

<script src="https://cdn.jsdelivr.net/npm/filter-data@0.2.0/dist/filterdata.min.js"></script>

Installation

filter-data is available as an npm package.

npm install --save filter-data

Usage

From Browser

import from FilterData object. And others are the same with From npm

const { filterData, SearchType } = FilterData;
.
.
.

From npm

  1. search single key only.

    import { filterData, SearchType } from 'filter-data';
    
    // search firstName contains 'dan' and age < 20
    const searchConditions = [
      {
        key: 'firstName',
        value: 'dan',
        type: SearchType.LK,
      },
      {
        key: 'age',
        value: 20,
        type: SearchType.LT,
      },
    ];
    
    const result = filterData(data, searchConditions);
    // output:
    <!-- [
      { firstName: 'Daniel', age: 14 },
      { firstName: 'Dan', age: 18 },
    ] -->
  2. search multiple keys.

    import { filterData, SearchType } from 'filter-data';
    
    // search firstName&lastName contains 'dan' and age < 20
    const searchConditions = [
      {
        key: ['firstName', 'lastName'],
        value: 'dan',
        type: SearchType.LK,
      },
      {
        key: 'age',
        value: 20,
        type: SearchType.LT,
      },
    ];
    
    const result = filterData(data, searchConditions);
    // output:
    <!-- [
      { firstName: 'Daniel', lastName: 'Johnson', age: 13 },
      { firstName: 'Jack', lastName: 'Danny', age: 19 },
    ] -->
  3. caseSensitive.

    import { filterData, SearchType } from 'filter-data';
    
    // search firstName contains 'dan'
    const searchConditions = [
      {
        key: 'firstName',
        value: 'dan',
        type: SearchType.LK,
      },
    ];
    
    const result = filterData(data, searchConditions, { caseSensitive: true });
    // output:
    <!-- [
      { firstName: 'Jordan', age: 17 },
    ] -->
  4. offset & limit.

    import { filterData, SearchType } from 'filter-data';
    
    // search firstName contains 'dan'
    const searchConditions = [
      {
        key: 'firstName',
        value: 'dan',
        type: SearchType.LK,
      },
    ];
    
    const result = filterData(data, searchConditions, { caseSensitive: true, offset: 10, limit: 10 });
    // output:
    <!-- [
      { firstName: 'Jordan', age: 17 },
      .
      .
      .
      max 10 records
    ] -->
  5. search nested object.

    import { filterData, SearchType } from 'filter-data';
    
    // search firstName in father's sub object equals to 'dan'
    const searchConditions = [
      {
        key: 'father.firstName', // or key: [['father', 'firstName']]
        value: 'dan',
        type: SearchType.EQ,
      },
    ];
    
    const result = filterData(data, searchConditions);
    // output:
    <!-- [
      { firstName: 'Jordan', age: 17, father: { firstName: 'dan', age: 50 } },
    ] -->

Instructions

No. Parameter required Default Description
1 data array of object for filtering
2 searchConditions array of searchCondition; { key: 'search column', value: 'search value', type: 'search type' }
3 options { caseSensitive: false, includeNull: false, offset: undefined, limit: undefined } includeNull: include data even key is not exist or value is null

SearchType

  • SearchType.EQ: equal
  • SearchType.GT: greater than
  • SearchType.GTE: greater than or equal
  • SearchType.LT: less than
  • SearchType.LTE: less than or equal
  • SearchType.LK: like
  • SearchType.NE: not equal
  • SearchType.NLK: not like

License

This project is licensed under the terms of the MIT license.