How to convert JSON object to array of String and number in JavaScript

Question

I have the following response from a GET request to an API end point:

{ 
  "success": true,
  "data": {
    "categories": [
        {
            "id": 1,
            "label": "Default",
            "url": "default",
            "num_of_subs": 0
        },
        {
            "id": 2,
            "label": "Pet Grooming",
            "url": "pet-grooming",
            "num_of_subs": 2
        },   
    ],
    }
}

Here is the fetch code:

const sendRegisterData = fetch('https://sg.cuzzey.com/api/listings/categories', {
        method: 'GET',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
        },
    })
        .then((response) => response.text())
        .then((responseText) => {
            var response_final = JSON.parse(responseText);
            if (response_final.success) {
                this.setState({
                    categories: response_final.data.categories,
                })
            }
        })

What I want to do, is to get the data from the categories and print them out as String and number (id and num_of_subs as number, label and url as String). Here is what I did:

const category_options = this.state.categories.map(category => {
        return [<Text key={category.id} style={styles.smallTextBox}> {category.id} {'\n'}</Text>,
        <Text key={category.label} style={styles.smallTextBox}>  {category.label} {'\n'}</Text>,
        <Text key={category.num_of_subs} style={styles.smallTextBox}>  {category.num_of_subs} {'\n'}</Text>]
    })

<ModalDropdown options={category_options} onSelect={(idx, label) => this.getCategory(idx, label)}>
                <Text style={styles.smallTextBox}> {this.state.selected_category} </Text>
</ModalDropdown>

I used this code to get the value of id, label and num_of_subs:

getCategory = (idx, value) => {
    this.setState({ category_id: value[0], selected_category: value[1], numSubs: value[2] })
}

When I print out category_id, selected_category and numSubs, the values are correct. However, they are object types and not String/number. I want to manipulate the values but I don't know how to convert them into String/number. I have tried using String(), Number(), parseInt(), JSON.parse(), toString() but none seems to work as they all result in "object" when I print out the typeof of the values.

Can I ask is there a way to solve this?

I would like to be able to do something like: if (this.state.numSubs > 0) { render_something() else { render_something_else() } Currently the numSubs is not a number so I can't use it to compare with anything. — Nguyễn Dũng
– Nguyễn Dũng, Commented Jun 13, 2017 at 14:47

Rick · Accepted Answer · 2017-06-13 15:23:50Z

2

Your code is not working because you are not iterating through the array of objects. You are simply returning the object of arrays. This is why you cannot extract the value

var items = [{
  "success": true,
  "data": {
    "categories": [{
        "id": 1,
        "label": "Default",
        "url": "default",
        "num_of_subs": 0
      },
      {
        "id": 2,
        "label": "Pet Grooming",
        "url": "pet-grooming",
        "num_of_subs": 2
      },
    ],
  }

}]

setState = [];
var catagories = items.map(x => x.data.categories);
catagories = catagories.reduceRight(x => x.cantact([]));
getCategory = (values) => {
  for (let value of values) {
    setState.push({
      category_id: value.id,
      selected_category: value.label,
      numSubs: value.num_of_subs
    })
  }
}

var output = getCategory(catagories)
var results = setState.filter(x => x.numSubs > 0)

console.log(results);

answered Jun 13, 2017 at 15:23

Rick

1,05511 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Nguyễn Dũng Over a year ago

Can I ask what does this line catagories = catagories.reduceRight(x => x.cantact([])); do? More specifically, what does cantact([]) do?

Rick Over a year ago

@Nguyen Dung it removes the outer array. Can you select the answer if you found it useful

Collectives™ on Stack Overflow

How to convert JSON object to array of String and number in JavaScript

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related