Code that generates a JSON object based on a .json file

I'm currently working on a function that is designed to extract data from a locally stored .json file, specifically one called products.json. The function in question looks like this:

async function getJSON_Format(){

    let response = await fetch(api);
    let data = await response.json();
    
    // console.log(data);

    return data;    
    
}

The variable api represents the file path for products.json. My goal is to retrieve all the information contained within products.json and save it as a JSON object variable using a line similar to

let json_object = getJSON_Format();
. However, the current issue is that this returns a promise.

I am seeking advice on how to address this problem. Any suggestions?

Answer №1

Since your function is marked as async, remember to use await when calling it. For example:

let data = await fetchJSON_Data();

However, you must ensure that this code block is inside an async function.

Alternatively, you can handle it as a Promise and utilize the then method like so:

fetchJSON_Data().then(data => {
  // perform operations on data here
});

I have also modified the variable name from json_object to simply obj. Keep in mind that the term "JSON object" is misleading, as something is either JSON (text) or an actual Javascript object.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Learn the process of utilizing Uglify.js to combine JavaScript files for individual views within Express.js

My website is currently built on express.js and I am looking to optimize my JavaScript files using uglify.js in the build process. An example of a typical view on my site appears as follows: extend layout block head script(src="/js/polyfills/html5s ...

What is the best way to create a moving line using EaselJS and TweenJS?

My objective is to animate a line from point A to point B using the Tween function. I am utilizing the EaselJS drawing library and TweenJS for animation. Can I achieve this by using the moveTo function to animate a straight line from point A to point B? ...

What is the process for incorporating the 'url-regex' npm package into an Angular(2/4) project?

I'm currently working on a project with Angular 4 and I've run into some issues while trying to use the url-regex package within my Component. After some troubleshooting, I discovered that this approach seems to work: import * as urlRegex from ...

Processing JSON data from an array in PHP

Currently, my code involves utilizing an AJAX request to retrieve data from a database dynamically. The data received is processed by the PHP function json_encode() before being sent back to AJAX. Upon receiving the data through the AJAX request, it is for ...

Utilizing AngularJS to invoke REST API calls within a for loop and efficiently manage priority for the visible content area

Currently, I am dealing with an array containing over 400 data IDs related to different fruits. My goal is to make API calls in a for loop to retrieve relevant information about each fruit. While this works fine for smaller lists, it fails when dealing wit ...

What could be causing the Google API to malfunction in my Universal Windows App?

Error: 0x800a138f - JavaScript runtime error: Unable to access 'setApiKey' property of undefined or null reference Hello, I am struggling to make this work on my Universal Windows App. There is a sample for Google's URL shortener with instr ...

When implementing AngularJS in a situation where the page layout is created by the user, what is the best

As I work on developing a web application, my main goal is to incorporate around 6 unique "widgets" that users can interact with. These widgets will serve different functions and users will have the ability to add, remove, and position them as they wish on ...

Handling versioning when a property is deprecated in semver

We've implemented semver for maintaining our CSS libraries, ensuring we adhere to the official guidelines for versioning. However, when we render a class obsolete (or for JavaScript - a property or argument), what is the recommended action? The clien ...

Exploring the capabilities of storing and retrieving nested objects within a React database

I'm having trouble retrieving nested items from my database. This is how my database is structured: GET /dwelling/room/ [ { "room_id": 1, "room_name": "Living Room", "room_data": [ { "id": 1, ...

Ways to confirm the presence of a specific string in an array obtained from JSON_QUERY

I'm currently grappling with creating a SQL statement that can effectively parse JSON and filter only rows where a specific value exists within one of the arrays in the JSON Object. Take this example JSON: Object 1: { "Key1": ["item1", "item2", "i ...

Guarding Vue.js routes when navigating based on asynchronous authentication state requests

I have integrated Firebase for authentication in my Vue.js application. The main (main.js) Vue component handles the authentication logic as follows: created() { auth.onAuthStateChanged((user) => { this.$store.commit('user/SET_USER&apo ...

Creating interactive tabs within the HTML document with AngularJS

Trying to customize the tab layout on my HTML page and I have a code similar to this: <form name="requestForm"> <div class="form-group col-md-6 md-padding"> <div class="text-primary"> <h3>Create Request</h3> ...

Determine if all resources on a page in Angular 4 have finished loading by keeping a loader spinning until everything is fully loaded

As part of my work on an Angular app, I am developing a loader to enhance user experience. While the typical approach involves utilizing a boolean parameter for subscribing to HTTP requests, in my case, the service's response consists of multiple ima ...

Proper method for calling a function within a specific scope

I am utilizing user-contributed modules that I aim to avoid editing in order to make upgrades easier. My goal is to enable users to browse for a CSV file on the local filesystem, parse it, and display it in a dynamic table. For this task, I am using PapaP ...

HTML-Formatted Email Content

Similar Question: MailTo with HTML body I am looking to utilize JavaScript to send emails. I came across this helpful post: Sending emails with JavaScript. My goal is to include images, bold text, and color changes in the email content. Does anyone h ...

Displaying information obtained from other sources

Is there a way to extract data from websites without APIs and display it on my own website using JavaScript and React? I am looking to showcase information from multiple websites on my own site, but unfortunately these websites do not have public APIs. Ho ...

The server's reply can be either an empty object or an error stating "Unexpected token < in JSON at position 0" in Node

While experimenting with a fake JSON file in a single-page app, I keep encountering the error Unexpected token < in JSON at position 0, or receiving an empty object when using JSON.stringify() on my promise return. This issue has been troubling me for t ...

What is the best way to swap out a portion of the attribute values for a group of elements using jQuery?

Currently, I am attempting to update the 'for' attributes of labels based on their existing content. The application makes use of AJAX to insert an item into an invoice without requiring a page refresh. After confirming that the item has been su ...

When attempting to update my avatar using client.user.setAvatar(), the desired changes fail to take effect

Currently, I am attempting to update the bot avatar with a specific user's avatar, but I seem to be encountering some difficulties. I have attempted the following code: client.users.fetch('userid').then((user) => { client.user.setAva ...

Learn the process of swapping an image with a button to trigger an onclick function using JavaScript

Currently, I am using an image button in JSP to trigger a JavaScript function upon click. The code snippet I have is as follows: <img src="<%= imagesDir%>/bt_pre.gif" onclick="return PreviousQ();" id="prevbtn" style="cursor: hand;"> The above ...