Converting JSON value into JavaScript array

Question

I want to convert a JSON string into a set of array containing the values from the JSON. after json.stringify(jsonmybe) and alert it display [{"role":"noi_user"},{"role":"bert_user"}] (which i saw as a JSON). I want to get the noi_user and bert_user and set them into a javascript array. something like ['noi_user','bert_user'] with quotes in each value.

I did the var stringy = json.parse() and the alert showing [object Object]. and further add this lines

for (var i = 0; i < stringy.length; i++) {
    arr.push(stringy[i]['role']);}

and the arr I get was a value with comma when in alert but the comma missing as i display them in the text field and it becomes a long string like noi_userbert_user

What I really want is from [{"role":"noi_user"},{"role":"bert_user"}] to ['noi_user','bert_user']

as an FYI the quote type (`'` and `"` are identical in JS) are irrelevant — Liam, Jul 19 '19 at 07:30
If you want JSON (which has different rules about quotes) then `['noi_user','bert_user']` is invalid **JSON**. See https://jsonlint.com/. Be wary of using JSON and JS objects interchangeably, they are not the same thing and have subtly different syntax rules. — Liam, Jul 19 '19 at 07:32
Possible duplicate of [From an array of objects, extract value of a property as array](https://stackoverflow.com/questions/19590865/from-an-array-of-objects-extract-value-of-a-property-as-array) — adiga, Jul 19 '19 at 07:41

score 8 · Accepted Answer · answered Jul 19 '19 at 07:28

8

Use JSON.parse and then reduce to get what you want,

var s = `[{"role":"noi_user"},{"role":"bert_user"}]`

var arr = []
try {
  arr = JSON.parse(s).reduce((acc, val)=>[...acc, val.role], [])
} catch (e){
  console.log("Invalid json")
}
console.log(arr)

answered Jul 19 '19 at 07:28

Anurag Awasthi

6,115
2
18
32

but brother, do you know why if i set my text field with the array value, the comma and the `[bracket]` went missing. I am still getting a long string without any delimited thing. – Binoy Jul 19 '19 at 08:05
When you set array value to input field value, js will convert array to string by calling it's `toString` method, which will join the array value to make a string. – Anurag Awasthi Jul 19 '19 at 08:26
Thats right. Thanks brother. and I am using `toString` to convert the array before displaying it into the field control and all went good. – Binoy Jul 19 '19 at 08:29

score 2 · Answer 2 · answered Jul 19 '19 at 07:27

Is this what you are loking for ? You can map on your array and just extract the role attribute of each datum.

const jsonString = ...
const data = JSON.parse(jsonString).map(data => data.role);
console.log(JSON.stringify(data, null, 2));

JSON uses double quotes to delimit strings and field names.

score 1 · Answer 3 · answered Jul 19 '19 at 07:36

So you have a JSON string like

'[{"role":"noi_user"},{"role":"bert_user"}]'

You want to convert it to an object, then extract values of "role" fields of each element, put them all into an array.

Your example json string contains an array of user objects within "role" fields. Following code takes this list, loops through each user object and puts role's of each object into a separate array roleList.

    var jsonStr = '[{"role":"noi_user"},{"role":"bert_user"}]';
    
    var userObjList = JSON.parse(jsonStr);
    var roleList = [];
    userObjList.forEach(userObj => {
        roleList.push(userObj.role);
    });
    console.log(roleList);

Abhay Maurya · Answer 4 · 2019-09-26T06:36:39.743

1

You could make a custom function to produce a sort of array_values in PHP but an indented and 2D level like so:

function array_values_indented (input) {
  var tmpArr = []
  for (key in input) {
    tmpArr.push(input[key]['role']);
  }
  return tmpArr
}

var object = JSON.parse('[{"role":"noi_user"},{"role":"bert_user"}]');
var result = array_values_indented(object);
console.log(result);

edited Sep 26 '19 at 06:36

answered Jul 19 '19 at 07:37

Abhay Maurya

11,819
8
46
64

Converting JSON value into JavaScript array

4 Answers4