Organize + Automate + Deploy = Webpack Chapter 16
Now that our application works, you can see how much we will gain by putting 0.93
dollars into a bank account with 2.25 percent interest and hibernating for 1,000 years (4.3
billion dollars!):
The formula inside the code is not much of a bother right now. Still, what if we had another
component that also does the same calculation? We would also like to make it more explicit
that we are computing the compound interest and we don't actually care what the formula
does in this scope.
Create a new file, named compoundInterest.js, inside the src folder; write the
following code inside it:
export default function (Principal, yearlyRate, years) {
const P = Principal
const r = yearlyRate
const t = years
return P * Math.pow((1 + r), t)
}
We then modify the code in App.vue accordingly:
computed: {
final () {
return compoundInterest(
this.principal,
this.interestRate,
this.timeYears
)
}
}
Also, remember to import the file we just created at the top of the JavaScript part:
<script>
import compoundInterest from './compoundInterest'
export default {
...