Generate a fresh array using the information extracted from a JSON file

I need assistance in extracting a new array from JSON data. The desired output should be an array containing "itog" values.

[12860498,20156554,19187309]

[
      {
        "0": {
          "itog": 12860498,
          "return": 1107294,
          "beznal": 10598131
        },
        "date": "2021-01-31"
      },
      {
        "0": {
          "itog": 20156554,
          "return": 1147363,
          "beznal": 18127393
        },
        "date": "2021-02-28"
      },
      {
        "0": {
          "itog": 19187309,
          "return": 1667656,
          "beznal": 17597434
        },
        "date": "2021-03-31"
      }
    ]
javascriptvue.js

Answer №1

const numbers = [
  {
    "0": {
      "total": 12860498,
      "refund": 1107294,
      "noncash": 10598131
    },
    "date": "2021-01-31"
  },
  {
    "0": {
      "total": 20156554,
      "refund": 1147363,
      "noncash": 18127393
    },
    "date": "2021-02-28"
  },
  {
    "0": {
      "total": 19187309,
      "refund": 1667656,
      "noncash": 17597434
    },
    "date": "2021-03-31"
  }
];

const finalAmounts = numbers.map(function(item) {
  return item[0].total;
});

console.log( finalAmounts );

Answer №2

If you're looking to retrieve specific data from an array, you can leverage the power of Array.map.

var input = new Array({
    "0": {
      "itog": 12860498,
      "return": 1107294,
      "beznal": 10598131
    },
    "date": "2021-01-31"
  },
  {
    "0": {
      "itog": 20156554,
      "return": 1147363,
      "beznal": 18127393
    },
    "date": "2021-02-28"
  },
  {
    "0": {
      "itog": 19187309,
      "return": 1667656,
      "beznal": 17597434
    },
    "date": "2021-03-31"
  }
);

var output = input.map(item => item[0]['itog']);
console.log(output);

Answer №3

Kindly consider utilizing one of the proposed solutions as they align perfectly with your requirements.

For a more general approach, you may consider:

const data = [
  {
    "0": {
      "itog": 12860498,
      "return": 1107294,
      "beznal": 10598131
    },
    "date": "2021-01-31"
  },
  {
    "0": {
      "itog": 20156554,
      "return": 1147363,
      "beznal": 18127393
    },
    "date": "2021-02-28"
  },
  {
    "0": {
      "itog": 19187309,
      "return": 1667656,
      "beznal": 17597434
    },
    "date": "2021-03-31"
  }
];

let itogs = [];
data.forEach(entry => {
  itogs = [
    ...itogs,
    ...Object.values(entry)
      .map(obj => obj['itog'])
      .filter(itog => itog)
  ];
});


console.log(itogs);

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

Guide to obtaining ngPrime autocomplete text when the button is clicked within Angular 6

I am currently utilizing the ngPrime autocomplete feature to retrieve data from a service. My goal is to capture the text entered in the autocomplete field whenever a button is clicked. I attempted to access the value using getElementById.value within th ...

javascriptangularautocomplete

Prevent users from clicking on an element during a Vue transition using Vue's <transition> feature

Currently, I'm developing a project using Vue.js and implementing a feature where clicking on an element triggers a fade-out effect through the Vue transition tag. However, I've encountered an issue where during the fading process, the element re ...

vue.jsvuejs2

Steps for converting TypeScript code to JavaScript using jQuery, without the need for extra libraries or frameworks like NPM

My single-page dashboard is quite basic, as it just displays weather updates and subway alerts. I usually refresh it on my local machine, and the structure looked like this: project/ index.html jquery-3.3.1.min.js script.js I decided to switch it t ...

javascriptjquerytypescripttsc

Tips for concealing the Bottom bar action in React Native

Currently facing an issue with React Native - I need to hide the bottom action bar located just below my tab bar navigation. I'm trying to create a clone of the Disney + App and this particular problem has me stuck: Here's the bottom part of my ...

javascriptandroidreactjsreact-nativereact-navigation

What are some effective tactics for reducers in react and redux?

Working on a React + Redux project to create a web app that communicates with an API, similar to the example provided at https://github.com/reactjs/redux/tree/master/examples/real-world. The API I'm using returns lists of artists, albums, and tracks, ...

javascriptreactjsreduxreact-redux

Renaming errors within a project with a complex nested structure using npm

I am encountering an issue in my NodeJS project which consists of nested subprojects with their own package.json files. Whenever I make changes to dependencies in the subprojects, I encounter errors similar to the one below: npm ERR! code ENOENT npm ERR! ...

javascriptnode.jsnpm

Display a loading spinner with ReactJS while waiting for an image to load

I am working on a component that renders data from a JSON file and everything is functioning correctly. However, I would like to add a loading spinner <i className="fa fa-spinner"></i> before the image loads and have it disappear once the ima ...

javascriptjsonreactjs

What steps should I follow to run my JavaScript application locally on Linux Mint?

Currently, I am diligently following a tutorial and ensuring that each step is completed accurately. My goal is to locally host my javascript app at localhost:3000. Unfortunately, I am facing difficulties as every attempt to run npm run dev results in an e ...

javascriptnpmlocalhost

Ways to determine if the keys of an object are present in an array, filtered by the array key

Working on an Angular 2 Ionic application and I'm wondering if there's a straightforward way to filter individuals by age in a specific array and then verify if any key in another object matches the name of a person in the array, returning a bool ...

javascripttypescript

Looking to retrieve the full browser URL in Next.js using getServerSideProps? Here's how to do

In my current environment, I am at http://localhost:3000/, but once in production, I will be at a different URL like http://example.com/. How can I retrieve the full browser URL within getServerSideProps? I need to fetch either http://localhost:3000/ or ...

javascriptreactjsnext.js

Alter text within a string situated between two distinct characters

I have the following sentence with embedded links that I want to format: text = "Lorem ipsum dolor sit amet, [Link 1|www.example1.com] sadipscing elitr, sed diam nonumy [Link 2|www.example2.com] tempor invidunt ut labore et [Link 3|www.example3.com] m ...

javascriptangulartypescript

Is it possible to efficiently transfer a Tensorflow.js Tensor between Node.js processes?

Currently, I am in the process of building an AI model using Tensorflow.js and Node.js. One of the challenges I am facing is handling a large dataset in a streaming manner due to its size being too massive to be stored in memory all at once. This task invo ...

javascriptnode.jstensortensorflow.js

Is there a way to pass locale data using props in VueJS Router?

To access hotel data, the URL path should be localhost:8080/hotel/:id (where id is equal to json.hoteID). For example, localhost:8080/hotel/101 This path should display the specific data for that hotel. In order to achieve this, we will utilize VueJS vu ...

javascripthtmlcssvue.jsvue-router

Ways to conceal all components except for specific ones within a container using JQuery

My HTML structure is as follows: <div class="fieldset-wrapper"> <div data-index="one">...</div> <div data-index="two">...</div> <div data-index="three">...</div> < ...

javascripthtmljquery

Retrieving URL from AJAX Request in Express JS

Currently, I am in the process of developing an Express App and encountering a challenge regarding the storage of the user's URL from which their AJAX request originated. In simpler terms, when a website, such as www.example.com, sends an HTTP request ...

javascriptjqueryajaxnode.jsexpress

An unfamiliar data type is provided as a number but is treated as a string that behaves like a number

Here is the code snippet in question: let myVar = unknown; myVar = 5; console.log((myVar as string) + 5); Upon running this code, it surprisingly outputs 10 instead of what I expected to be 55. Can someone help me understand why? ...

javascriptreactjstypescript

Delete items within the first 10 minutes of shutting it down

Is there a way to temporarily remove a newsletter element for 10 minutes after closing it on a webpage? The idea is that once the panel is closed, it should stay hidden even if the page is refreshed within that timeframe. I was considering using local stor ...

javascripthtmlcss

Center-align the text in mui's textfield

What I'm looking for is this: https://i.stack.imgur.com/ny3cy.png Here's what I ended up with: https://i.stack.imgur.com/vh7Lw.png I attempted to apply the style to my input props, but unfortunately, it didn't work. Any suggestions? Than ...

javascriptcssmaterial-ui

Is there a way to incorporate onComplete and onAbort callbacks with <router-link> similar to router.push(location, onComplete?, onAbort?)?

It is common knowledge that the onComplete and onAbort optional callbacks can be used as the 2nd and 3rd arguments in the router.push method. router.push(location, onComplete?, onAbort?) These callbacks are triggered when the navigation is either success ...

vue.jsvuejs2vue-router

Issue in Ionic 2: typescript: The identifier 'EventStaffLogService' could not be located

I encountered an error after updating the app scripts. Although I've installed the latest version, I am not familiar with typescript. The code used to function properly before I executed the update. cli $ ionic serve Running 'serve:before' ...

javascriptangulartypescriptionic-frameworkionic2