优秀的编程知识分享平台

网站首页 > 技术文章 正文

【JS 数组分类】多场景实现数组分类

nanyue 2025-01-13 16:37:45 技术文章 3 ℃

在业务开发中,经常会遇见数组分类,一般情况下,我们都是根据具体业务场景来进行数据分类,但这种方式不够灵活,今天分享一种可以支持多场景实现分类数组的方法,方法很简单,主要是提供一种跳出具体业务场景的思维方式

比如对以下数据进行各种维度的分类,比如年龄,性别,年龄+性别等等

const people = [
  {name: 'John', age: 25,sex:'male'},
  {name: 'Jane', age: 30,sex:'female'},
  {name: 'Bob', age: 25,sex:'male'},
  {name: 'Alice', age: 30,sex:'female'},
  {name: 'Tom', age: 25,sex:'male'},
  {name: 'Jerry', age: 30,sex:'female'},
  {name: 'Mike', age: 25,sex:'male'},
  {name: 'Lucy', age: 30,sex:'female'},
  {name: 'Jack', age: 25,sex:'male'},
  {name: 'Mary', age: 32,sex:'female'},
  {name: 'Peter', age: 25,sex:'male'},
]

代码实现

//arr 数据源
//generateKey 一个可以生成分类键值的方法或者字符串
//根据键值来进行分类
function groupBy(arr,generateKey) {
  //分类之后的返回数据
  const result = {}
  if(!Array.isArray(arr)){
    throw new TypeError('arr is not an array')
  }
  //分类键值判断
  //判断键值是字符还是fn
  if(typeof generateKey=== 'string'){
    let key = generateKey
    generateKey = (item)=>item[key]
  }
  for (let i = 0; i < arr.length; i++) {
    //获取分类键值
    const key = generateKey(arr[i],i,arr)
    if (!result[key]) {
      result[key] = []
    }
    result[key].push(arr[i])
  }
  return result
}

执行(多场景数据分类)

//generateKey 为fn
const r = groupBy(people,item=>item.age)
console.log('r-age',r)

//generateKey 为string
const r1 = groupBy(people,'sex')
console.log('r-sex',r1)

//generateKey 为fn
const r2 = groupBy(people,item=>item.age>25?'old':'young')
console.log('r-old-young',r2)

//generateKey 为fn
const r3 = groupBy(people,item=>`${item.age}-${item.sex}`)
console.log('r-age-sex',r3)

数据结果

  1. generateKey 为 (item)=>item.age
  1. generateKey 为 sex
  1. generateKey 为 (item)=>item.age>25?'old':'young')
  1. generateKey 为 (item)=>`${item.age}-${item.sex}`

其他数据分类

const r4 = groupBy([0,1,2,3,4,5,6],(item)=>item%2===0?'even':'odd')
//r-奇偶分类 { even: [ 0, 2, 4, 6 ], odd: [ 1, 3, 5 ] }


最近发表
标签列表