CODEWITHSUNDEEP
javascriptvue.jsvuejs2
Philipp Kishkovarov
Philipp Kishkovarov

Reputation: 223

How to return value from loop. js, vuejs

Sorry, I'm beginner with JS,i have a basic question, but i spent a whole day trying to find answer in google and i didn't.

I have a massic financial instrument developed on php and I need to build complex financial calculator that shows everything with reactivity. I need help to figure out how to make complex calculations with many if statements inside of the loop and then sum output value from each object in array and return total summed value. Using Vuejs for this.

So my cashDividends() must be a sum of calculated values from each object in the loop.

Below I put a piece of code to understand problem I'm facing.

Please check if have a minute. Thanks!

     new Vue({
    el: "#waterfall",
    data() {
        return {
        info: {
            cash_dividends: true,
            converted_liabilities: true,
        },
        equities: [
            @foreach($preferredEquities as $equity)
            { name: '{{ $equity->name }}', id: {{ $equity->id }} },
            @endforeach
            ]
        }
    },
    computed: {
        remainingExit () {
            return this.form.exit_value - this.form.uncovered_debt - this.form.transaction_fees
        },
        cashDividends() {
    //I supposed should be something like this.     
          this.equities.forEach(function(equity)
          {
            //Here I make a lot of calculations with bunch of if statements using object and DOM input values. for each object 

          }
          // And here I need to return sum of calculated values from each object (equity) in array 
        }
    },

Upvotes: 0

Views: 1611

Answers (3)

Milan Jaric
Milan Jaric

Reputation: 5646

Use reduce function 

new Vue({
el: "#waterfall",
data: {
    equities: [
           {name: "Serias A", price: '20'},
           {name: "Serias B", price: '21'},
        ]
},
computed: {
    cashDividends() {
        var sum = this.equities.reduce(function(acc, equity) {
            return acc + parseInt(equity.price);
        }, 0)
    }
}
});

Upvotes: 1

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

You could use reduce function which you could learn more about here:

new Vue({
  el: "#app",
  data: {
    equities: [{
        name: "Serias A",
        price: 20
      },
      {
        name: "Serias B",
        price: 21
      },
    ]
  },
  computed: {
    cashDividends() {
      return this.equities.reduce(this.sum);
    }
  },
  methods: {
    sum(total, num) {

      return total.price + num.price
    }
  }
});
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.1/vue.min.js"></script>
<div id="app">
  {{cashDividends}}
</div>

Upvotes: 2

feanor07
feanor07

Reputation: 3368

You can define a variable sum and iteratively add equity.price to it as follows:

    cashDividends() {
        let sum = 0
        this.equities.forEach(function(equity)) {
            sum+=equity.price
        }

        return sum
    }

Upvotes: 0

Related Questions