javascript (no jquery) - load a local json file

Question

I have a local JSON file which I converted into a JS object by adding var data = ... in front of that:

var data = {
    "people": [
        {
            "name": "Martin",
            "surname": "Smith"
        },
        {
            "name": "Jack",
            "surname": "Smith"
        }
    ]
}

I load it with: <script src="data.json" type="text/javascript"> and try to parse it with:

var h = JSON.parse(data);

I get the following error:

SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data

You don't have to parse it. The JavaScript parser will do that for you implicitly, and your variable data is ready to use. — Pointy
– Pointy, Commented Aug 11, 2015 at 23:41
What's your question? You can't use JSON.parse because it's not JSON anymore. — Jordan Running
– Jordan Running, Commented Aug 11, 2015 at 23:41

Quentin · Accepted Answer · 2015-08-11 23:42:39Z

3

When you put var data = { in front of it, it stops being JSON and becomes JavaScript. (So you shouldn't give it a .json file extension and that will encourage servers to tell browsers that it is JSON and not JS).

In this case, it is a JavaScript program that assigns an object to a variable.

JSON.parse takes a string containing JSON and converts it into a JavaScript object (or array or other data type).

Don't parse it. It is already parsed by the JavaScript compiler.

answered Aug 11, 2015 at 23:42

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

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

3 Comments

Wasteland Over a year ago

Ok I understand. Is there a way of loading a JSON file then? I have read for security reasons, it's not possible to load a local file. So how do people work with json files and javascript? I'm learning js, I don't really want to get into jquery. Thank you.

Quentin Over a year ago

Use a webserver and load the data over HTTP with XMLHttpRequest.

Wasteland Over a year ago

Ok. Thanks. For now, I'm going to be use what was advised above (no JSON.parse). Having said that, I'll also google for XMLHttpRequest to learn it in the future.

Anthony Bobsin · Accepted Answer · 2015-08-11 23:44:34Z

1

Here MZN JSON.parse() you can see what JSON.parse() should be used for. It is used on a String that contains a JSON object, and this method would parse it into the format that your data variable is already in. Since your data variable is already in JSON format, your variable is ready to use and you do not need the JSON.parse() method.

answered Aug 11, 2015 at 23:44

Anthony Bobsin

1681 silver badge8 bronze badges

Collectives™ on Stack Overflow

javascript (no jquery) - load a local json file

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related