Convert JSON array into individual variables using javascript

Question

I have the following JSON array that is output from an API.

{
    "location": {
        "name": "Alanallur",
        "region": "Kerala",
        "country": "India",
        "lat": 11.01,
        "lon": 76.33,
        "tz_id": "Asia/Kolkata",
        "localtime_epoch": 1470998311,
        "localtime": "2016-08-12 10:38"
    },
    "current": {
        "last_updated_epoch": 1470997826,
        "last_updated": "2016-08-12 10:30",
        "temp_c": 28.0,
        "temp_f": 82.4,
        "is_day": 1,
        "condition": {
            "text": "Moderate rain",
            "icon": "//cdn.apixu.com/weather/64x64/day/302.png",
            "code": 1189
        },
        "wind_mph": 8.1,
        "wind_kph": 13.0,
        "wind_degree": 340,
        "wind_dir": "NNW",
        "pressure_mb": 1013.0,
        "pressure_in": 30.4,
        "precip_mm": 0.0,
        "precip_in": 0.0,
        "humidity": 79,
        "cloud": 0,
        "feelslike_c": 32.2,
        "feelslike_f": 89.9
    }
}

I want to split this array into separate variables using javascript

1) you have no array there, 2) JSON has no arrays, it is a string, 3) when parsed, you'll have a javascript object, with no array — Jaromanda X, Aug 12 '16 at 06:10
You've no array in JSON String. http://json-parser.com/6d51ab22 Which field you want as separate variable ? — Alok Patel, Aug 12 '16 at 06:12
Should `location` and `current` be the two resulting variables? — guest271314, Aug 12 '16 at 06:12
You need to use `JSON.parse()`, it's explained [here](http://stackoverflow.com/questions/4935632/parse-json-in-javascript) — Aakash, Aug 12 '16 at 06:13
What you want to do exactly? Do you want two arrays, `location` and `current`? And, why you want to split JSON string into array? Object is not suitable? — Bhavik Shah, Aug 12 '16 at 06:15
What i want is seperate js varibles from this JSON object . I just need the country and temperature as seperate js varibles — Aiswarya Krishna, Aug 12 '16 at 06:19

Haresh Vidja · Answer 1 · 2016-08-12T06:23:58.853

1

if this response is in data

check alert(typeof data) // it will show object or string

if it is not object then

data= JSON.parse(data)

now you can access it as saperate variable

if you want to access localtime of location then

alert(data.location.localtime)

I hope it make sense for you Check two example on jsfiddle

https://jsfiddle.net/5ov827oc/1/

https://jsfiddle.net/5ov827oc/2/

edited Aug 12 '16 at 06:23

answered Aug 12 '16 at 06:18

Haresh Vidja

8,340
3
25
42

score 1 · Answer 2 · answered Aug 12 '16 at 06:19

Json Code

{
posts:[
   "location": {
        "name": "Alanallur",
        "region": "Kerala",
        "country": "India",
        "lat": 11.01,
        "lon": 76.33,
        "tz_id": "Asia/Kolkata",
        "localtime_epoch": 1470998311,
        "localtime": "2016-08-12 10:38"
    },
    "current": {
        "last_updated_epoch": 1470997826,
        "last_updated": "2016-08-12 10:30",
        "temp_c": 28.0,
        "temp_f": 82.4,
        "is_day": 1,
        "condition": {
            "text": "Moderate rain",
            "icon": "//cdn.apixu.com/weather/64x64/day/302.png",
            "code": 1189
        },
        "wind_mph": 8.1,
        "wind_kph": 13.0,
        "wind_degree": 340,
        "wind_dir": "NNW",
        "pressure_mb": 1013.0,
        "pressure_in": 30.4,
        "precip_mm": 0.0,
        "precip_in": 0.0,
        "humidity": 79,
        "cloud": 0,
        "feelslike_c": 32.2,
        "feelslike_f": 89.9
    }
}

In javascript use

 json.parse()

PHP Code

<?php
// copy file content into a string var
$json_file = file_get_contents('posts.json');
// convert the string to a json object
$jfo = json_decode($json_file);
// read the title value
$title = $jfo->result->title;
// copy the posts array to a php var
$posts = $jfo->result->posts;
// listing posts
foreach ($posts as $post) {
    echo $post->title;
}
?>

Hope this helps. :)

Alok Patel · Answer 3 · 2016-08-14T17:14:03.510

1

This is how you can get country and it's temparutre in separate JS variables.

var jsonobject=JSON.parse(json_string); // don't do this if you already have JSON Object instead of string.
var country=jsonobject.location.country. // Where location is another JSON Object
var temprature_c=jsonobject.current.temp_c; // current is another JSON Object
var temprature_f=jsonobject.current.temp_f; // current is another JSON Object

See this to debug your JSON. http://json-parser.com/6d51ab22

Where { } is a literal notation for an Object, access any property inside { } with . operator,
and [ ] is a literal notation for an Array. You can access array elements just like normal JS array using indices (e.g [0], [1] etc...)

edited Aug 14 '16 at 17:14

answered Aug 12 '16 at 06:34

Alok Patel

7,842
5
31
47

"You keep using that word. I do not think it means what you think it means." [There is no such thing as a "JSON Object"](http://benalman.com/news/2010/03/theres-no-such-thing-as-a-json/). – Jason Cust Aug 13 '16 at 21:18
{ } simply means it's an Object with key value pairs. – Alok Patel Aug 14 '16 at 06:04
My original comment was a jest as a large number of people make that mistake hence the [Princess Bride](https://www.youtube.com/watch?v=wujVMIYzYXg) quote. However to clarify it a bit more: JSON is a String type and not an Object type. JSON is an acronym that means **J**ava**S**cript **O**bject **N**otation. In your answer you state "`{ }` means it's an JSON Object" which is patently false. It should read something like "`{ }` is literal notation for an Object" if you want to be accurate. Anyway, I hope this helps with understanding the difference. – Jason Cust Aug 14 '16 at 13:15
@JasonCust Thanks for throwing the light, corrected my answer :) – Alok Patel Aug 14 '16 at 17:14

Aman Maurya · Answer 4 · 2016-08-12T06:52:24.543

Try this code : Use developer console to view the output in browser

<script>
var str = '{"location":{"name":"Alanallur","region":"Kerala","country":"India","lat":11.01,"lon":76.33,"tz_id":"Asia/Kolkata","localtime_epoch":1470998311,"localtime":"2016-08-12 10:38"},"current":{"last_updated_epoch":1470997826,"last_updated":"2016-08-12 10:30","temp_c":28,"temp_f":82.4,"is_day":1,"condition":{"text":"Moderate rain","icon":"//cdn.apixu.com/weather/64x64/day/302.png","code":1189},"wind_mph":8.1,"wind_kph":13,"wind_degree":340,"wind_dir":"NNW","pressure_mb":1013,"pressure_in":30.4,"precip_mm":0,"precip_in":0,"humidity":79,"cloud":0,"feelslike_c":32.2,"feelslike_f":89.9}}';

if(typeof(str) == 'string'){
        str = JSON.parse(str);
        console.log(str.current)//return object
        console.log(str.location)//return object
        console.log(str.current.temp_c)//return string
        console.log(str.current.temp_f)//return string
        console.log(str.location.country)//return string
}
</script>

JSON.parse(str) is used to convert string to object

Convert JSON array into individual variables using javascript

4 Answers4