Utilizing and saving JSON data in JavaScript

Question

Utilizing and saving JSON data in JavaScript

I am currently working on developing a 2D, top-down RPG game inspired by Zelda for the web...

My plan is to organize dialog in JSON format...

Right now, I have the JSON data stored in an external JavaScript file called js/json.js:

function getJson() {

var json = {
    "people" : 
    [
        {//NPC 1 - rescue dog

etc...

To access this data in my main game JavaScript file, I include it using

<script src="js/json.js"></script>

..`

var json = getJson();

Then, I can reference the data like this:

Labels[index].text = json.people[index].dialogs.start.texts[0];

I'm wondering if there would be any benefit to storing the JSON as a separate .txt file and then parsing it instead of keeping it as a JS file within a function.

Any insights would be greatly appreciated!

javascript json

Answer 1

Answer №1

Storing JSON data as a .js file allows for additional JavaScript functions to be added later if necessary, since JSON is essentially JavaScript. It's worth noting that the existing data file already includes a getJSON function, so storing it as a .txt file wouldn't be logical.

However, when data is being served through an API, there is no requirement for any file extension at all.

Answer 2

Storing JSON data as a .js file allows for additional JavaScript functions to be added later if necessary, since JSON is essentially JavaScript. It's worth noting that the existing data file already includes a getJSON function, so storing it as a .txt file wouldn't be logical.

However, when data is being served through an API, there is no requirement for any file extension at all.

Answer 3

Answer №2

When you're working with JavaScript, it's recommended to store your data in a pure JSON format and access it using jQuery.getJSON() or an XMLHttpRequest. This approach helps prevent conflicts by not adding unnecessary functions like getJson() to the global scope.

For example, you can have a file named dialog.json structured similar to your current setup but without the extra getJson() function:

{
    "people" : 
    [
        {//NPC 1 - rescue dog
         ...
        }
    ]
}

If you opt for jQuery, you can load the JSON data like this:

var dialog;
$.getJSON('json/dialog.json', function(data) {
    dialog = data;
    // Once the data is loaded, you can use it in your application.
    startGame();
});

By keeping your data separate from your code, you maintain better organization and reduce the risk of conflicts.

Answer 4

When you're working with JavaScript, it's recommended to store your data in a pure JSON format and access it using jQuery.getJSON() or an XMLHttpRequest. This approach helps prevent conflicts by not adding unnecessary functions like getJson() to the global scope.

For example, you can have a file named dialog.json structured similar to your current setup but without the extra getJson() function:

{
    "people" : 
    [
        {//NPC 1 - rescue dog
         ...
        }
    ]
}

If you opt for jQuery, you can load the JSON data like this:

var dialog;
$.getJSON('json/dialog.json', function(data) {
    dialog = data;
    // Once the data is loaded, you can use it in your application.
    startGame();
});

By keeping your data separate from your code, you maintain better organization and reduce the risk of conflicts.

Utilizing and saving JSON data in JavaScript

Answer №1

Answer №2

Similar questions

What is the best way to create a selection input using buttons and save the chosen option in the state?

How can you utilize jq to retrieve values from a JSON array that have a specific key with a boolean value of true

Tips for composing a single aggregation within a query

Sending a null JSON string in C# using HttpWebResponse

Guide to using jquery-throttle-debounce with addEventListener

Accessing a particular node in JSON using PHP's JSONPath function

Styling Your Navigation Bar with CSS and Active States

The function ng-click does not successfully uncheck ion-radio

Get ready for 10 AM with the RxJS timer function

Determining the position of a v-for element in Vue.js when making an HTTP request

Angular $mdDialog allowing for multiple instances to be created

Tips for sending arguments to an async function

Transform a React component from a regular function to an ES6 class

Initial button click fails to trigger onclick event

What methods are available for implementing animated hiding and showing of elements?

Error: Failed to parse the given color specification

Looking for a way to implement a vertical autoscroll <ul> list that responds to mouse movement using JavaScript and jQuery

Menu is not functioning properly as it is not staying fixed in place

Using Javascript/JQuery to apply pixel values in CSS styling

Setting a new state versus modifying the existing state by using setState have distinct nuances