What is the best way to extract a string from a JSON object array?

Question

What is the best way to extract a string from a JSON object array?

I'm encountering an issue retrieving any of the strings from the JSON data provided by the Google Finance API. When debugging, I keep getting "undefined." In the example below, my main focus is on extracting the symbol (t) and the current price (l).

 $.getJSON("http://finance.google.com/finance/info?client=ig&q=TSLA&callback=?",
        function(json) {
        var Stocks = json;
        var text ="";   
        text = Stocks.l + " represents the current stock price for: " + Stocks.t;
        document.getElementById('Textn').innerHTML = text; 

        });

javascript json

Answer 1

Answer №1

The reason Stocks.l is undefined is because the response you receive is an array, not a single object.

If you happen to get an array with multiple objects, using a loop would be helpful - even if there's only one element in the array, the loop won't cause any issues. The following code utilizes es6 object destructuring, which may not work in all browsers currently:

$.getJSON("https://finance.google.com/finance/info?client=ig&q=TSLA&callback=?", json => {
  for (let {l, t} of json) {
    let text = l + " is the current stock price for: " + t;
    document.getElementById('Textn').innerHTML += text;
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><div id="Textn">

</div>

A version with es5 syntax would look something like this:

$.getJSON("https://finance.google.com/finance/info?client=ig&q=TSLA&callback=?", function(json) {
  json.forEach(function(v) {
    var text = v.l + " is the current stock price for: " + v.t;
    document.getElementById('Textn').innerHTML += text;
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="Textn">

</div>

Answer 2

The reason Stocks.l is undefined is because the response you receive is an array, not a single object.

If you happen to get an array with multiple objects, using a loop would be helpful - even if there's only one element in the array, the loop won't cause any issues. The following code utilizes es6 object destructuring, which may not work in all browsers currently:

$.getJSON("https://finance.google.com/finance/info?client=ig&q=TSLA&callback=?", json => {
  for (let {l, t} of json) {
    let text = l + " is the current stock price for: " + t;
    document.getElementById('Textn').innerHTML += text;
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><div id="Textn">

</div>

A version with es5 syntax would look something like this:

$.getJSON("https://finance.google.com/finance/info?client=ig&q=TSLA&callback=?", function(json) {
  json.forEach(function(v) {
    var text = v.l + " is the current stock price for: " + v.t;
    document.getElementById('Textn').innerHTML += text;
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="Textn">

</div>

Answer 3

Answer №2

The data provided consists of an array containing multiple objects:

[
  {
    "order_id": "20675439",
    "product" : "iPhone",
    "price" : "$999"
    //and so on

To access specific properties of an object, you must first navigate through the array to locate the desired element:

data[0].product //retrieves the value of property "product" from the object at index 0 in the array, resulting in "iPhone"

Answer 4

The data provided consists of an array containing multiple objects:

[
  {
    "order_id": "20675439",
    "product" : "iPhone",
    "price" : "$999"
    //and so on

To access specific properties of an object, you must first navigate through the array to locate the desired element:

data[0].product //retrieves the value of property "product" from the object at index 0 in the array, resulting in "iPhone"

What is the best way to extract a string from a JSON object array?

Answer №1

Answer №2

Similar questions

Unable to process despite clicking button (no error messages)

Track the loading times of individual web pages using JavaScript

Discrepancy in Gson behavior between generated APK and debug mode

Code executing twice instead of once in Javascript

Altering the appearance of a different element with React

Implementing jquery document.ready() with <img onload> event

Alternative to dynamic arrays in Javascript

What is a Brief Illustration of the Jackson Scala Extension?

Having trouble loading HTML content from another file

Issues occurring with setting the variable using the Google latlng API

Changing CSS classes with each click of the user, using Jquery

A guide on verifying a username and password via URL using JavaScript

Tips for real-time editing a class or functional component in Storybook

Validating date and time picker pairs using JavaScript

Decoding into identical structure with distinct JSON identifier

Is it possible to utilize an API response within a conditional statement in NextJS?

Tips for improving the readability of my code

Implementing Default Language in Next.js 14 for Static Export without URL Prefix: A Step-by-Step Guide

How to eliminate a specific portion of a string within a string using PHP

What sets cross-fetch apart from isomorphic-fetch?