How to return value from loop. js, vuejs

Question

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 
        }
    },

Boussadjra Brahim · Accepted Answer · 2018-12-19 00:57:04Z

2

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>

edited Dec 19, 2018 at 0:57

answered Dec 19, 2018 at 0:41

Boussadjra Brahim

90k19 gold badges163 silver badges183 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Philipp Kishkovarov Over a year ago

returns [object Object][object Object]

Philipp Kishkovarov Over a year ago

and idea to loop it, because I need to make crazy math calculations inside of loop to get the value before sum it.

Boussadjra Brahim Over a year ago

@PhilippNoris, sorry i did a typo, i fixed it

Boussadjra Brahim Over a year ago

you could make that math calculations inside sum method or you could rename to be me accurate

Philipp Kishkovarov Over a year ago

Sounds interesting, I'm going to try it. Thx!

|

ykaragol · Accepted Answer · 2018-12-20 14:29:35Z

1

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)
    }
}
});

edited Dec 20, 2018 at 14:29

ykaragol

6,2413 gold badges32 silver badges59 bronze badges

answered Dec 19, 2018 at 0:58

Milan Jaric

5,6662 gold badges29 silver badges36 bronze badges

Comments

feanor07 · Accepted Answer · 2018-12-19 00:38:35Z

0

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
    }

answered Dec 19, 2018 at 0:38

feanor07

3,40119 silver badges29 bronze badges

Collectives™ on Stack Overflow

How to return value from loop. js, vuejs

3 Answers 3

9 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

9 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related