CODEWITHSUNDEEP
javascriptjsonreactjsloops
Bengal
Bengal

Reputation: 15

grouping looping data by the number of characters

can the data be repeated based on the number of characters in the akred_prodi property? For example, the number of characters for akredi_prodi = 1 and akred_prodi = more than 1 character

the data that I have :

akreditasi_internasional = [
    {
        "akred_prodi": "A",
        "jenis_akred_prodi": "Nasional",
        "jum": 201
    },
    {
        "akred_prodi": "B",
        "jenis_akred_prodi": "Nasional",
        "jum": 24
    },
    {
        "akred_prodi": "Baik",
        "jenis_akred_prodi": "Nasional",
        "jum": 7
    },
    {
        "akred_prodi": "Baik Sekali",
        "jenis_akred_prodi": "Nasional",
        "jum": 1
    },
    {
        "akred_prodi": "C",
        "jenis_akred_prodi": "Nasional",
        "jum": 1
    },
    {
        "akred_prodi": "Unggul",
        "jenis_akred_prodi": "Nasional",
        "jum": 6
    }
]

the data that I want to separate will look something like this : data with 1 character on akred_prodi

grouping_1 = [
    {
        "akred_prodi": "A",
        "jenis_akred_prodi": "Nasional",
        "jum": 201
    },
    {
        "akred_prodi": "B",
        "jenis_akred_prodi": "Nasional",
        "jum": 24
    },
    {
        "akred_prodi": "C",
        "jenis_akred_prodi": "Nasional",
        "jum": 1
    }
]

the data with more than 1 character :

grouping_2 = [
    {
        "akred_prodi": "Baik",
        "jenis_akred_prodi": "Nasional",
        "jum": 7
    },
    {
        "akred_prodi": "Baik Sekali",
        "jenis_akred_prodi": "Nasional",
        "jum": 1
    },
    {
        "akred_prodi": "Unggul",
        "jenis_akred_prodi": "Nasional",
        "jum": 6
    }
]

what i want display :

let display = [];
        this.state.akreditasi_internasional.map((list,i)=>{
            //some function to separate characters 
            // gruping 1 character and groupingmore than 1 in akred_prodi
            display.push(
            <Badge pill variant="secondary"  style={{width:'120px', marginRight:'3px', marginBottom:'3px'}}>
                {list.akred_prodi} &nbsp;&nbsp;&nbsp;
                <Badge variant="light"> {list.jum} </Badge>
            </Badge>);
        });

Upvotes: 1

Views: 34

Answers (2)

The Fool
The Fool

Reputation: 20467

I like to use reduce for grouping such arrays. Closing over an object where the keys are the groups i want. Here i do each unique count a new group. YOu can of course put different logic there

ai = [{
    "akred_prodi": "A",
    "jenis_akred_prodi": "Nasional",
    "jum": 201
  },
  {
    "akred_prodi": "B",
    "jenis_akred_prodi": "Nasional",
    "jum": 24
  },
  {
    "akred_prodi": "Baik",
    "jenis_akred_prodi": "Nasional",
    "jum": 7
  },
  {
    "akred_prodi": "Baik Sekali",
    "jenis_akred_prodi": "Nasional",
    "jum": 1
  },
  {
    "akred_prodi": "C",
    "jenis_akred_prodi": "Nasional",
    "jum": 1
  },
  {
    "akred_prodi": "Unggul",
    "jenis_akred_prodi": "Nasional",
    "jum": 6
  }
]


const op = ai.reduce((acc, curr) => {
  if (!acc[curr.akred_prodi.length]) acc[curr.akred_prodi.length] = []
  return acc[curr.akred_prodi.length].push(curr) && acc
}, {})


console.log(op)

Upvotes: 1

sushitrash
sushitrash

Reputation: 172

from your explanation i assumed that you wanted to divide the array of objects into 2 types :

  1. One that has akred_prodi value length of maximum 1 character
  2. One that has akred_prodi value length of more than 1 character

You can use this to get the 1 akred_prodi character objects :

let onechar = international.filter((inl) => inl.akred_prodi.length == 1)

and for more than 1 character :

let morethanonechar = international.filter((inl) => inl.akred_prodi.length > 1)

Upvotes: 1

Related Questions