Kirjautuminen

Haku

Tehtävät

Keskustelu: Koodit: HTML, JavaScript: Korkoa korolle -laskuri

Metabolix [09.10.2021 14:18:56]

#

Usein sijoitus- ja säästövinkeissä neuvotaan, että kannattaa aloittaa heti paikalla, koska korkoa korolle -ilmiön ansiosta kertyy niin huimasti rahaa. Harmi vain, että juuri koskaan ei eritellä kyseisen ilmiön tuottamaa summaa, ja laskureissa selvin vaikutus on yksinkertaisesti sillä, paljonko lisää rahaa pannaan säästöön joka kuukausi.

Tämä laskuri kertoo säästämisestä kertyvän pääoman, suoraan pääomalle kertyvän koron ja sen, paljonko tulee korkoa korolle. Laskurista selviää, että maltillisella 4 prosentin vuosituotolla 10 vuoden tasaisella säästämisellä kertyvästä loppusummasta vain pari prosenttia on korkoa korolle mutta nostamalla tuotto 9 prosenttiin vuodessa tai sijoitusaika 22 vuoteen koronkorko kattaa jo 10 prosenttia loppusummasta, ja näiden kahden asetuksen yhdistelmällä koronkorkoa on peräti kolmannes loppusummasta.

Laskuria voi kokeilla täällä. Laskuri on tehty HTML:llä ja JavaScriptilla, eli sen voi suoraan tallentaa .html-päätteiseen tiedostoon ja avata selaimella.

<!DOCTYPE html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
}
.datarivi label, .datarivi input[type=range] {
	display: block;
}
</style>

<h1>Korkoa korolle -laskuri</h1>

<form class="datalomake">
<p class="datarivi">
<label>Aloitussumma</label>
<input id="data-aloitus" type="number" min="0" max="100000"> euroa
<input id="range-aloitus" type="range" min="100" max="20000" step="100" value="1000">
</p>

<p class="datarivi">
<label>Säästösumma / kuukausi</label>
<input id="data-kuukausisumma" type="number" min="0" max="10000"> euroa
<input type="range" min="0" max="500" step="1" value="200">
</p>

<p class="datarivi">
<label>Tuotto / vuosi</label>
<input id="data-tuotto" type="number" min="0" max="200"> %
<input type="range" min="0" max="30" step="1" value="4">
</p>

<p class="datarivi">
<label>Säästöaika</label>
<input id="data-aika" type="number" min="1" max="100"> vuotta
<input type="range" min="1" max="50" step="1" value="10">
</p>
</form>

<h2>Laskelma</h2>

<p class="tulos"><span id="tulos-aika">0</span> vuodessa kertyy yhteensä <span id="tulos-summa">0</span> euroa.</p>
<ul class="tulos-erittely">
<li><span id="tulos-sijoitukset">0</span> euroa (<span id="tulos-sijoitukset-p">0</span> % loppusummasta) on talletettua pääomaa.
<li><span id="tulos-korko">0</span> euroa (<span id="tulos-korko-p">0</span> % loppusummasta) on korkoa suoraan pääomalle.
<li><span id="tulos-koronkorko">0</span> euroa (<span id="tulos-koronkorko-p">0</span> % loppusummasta) on korkoa korolle.
</ul>
<p>Ajanlasku alkaa ensimmäisen kuukausierän tallettamisesta.</p>
<p>Lopputuloksessa ei huomioida verojen vaikutusta.</p>

<script>
window.addEventListener("load", _ => {
	function näytäLuku(x, desimaaleja) {
		const k = Math.pow(10, desimaaleja | 0);
		return (Math.round(x * k) / k).toLocaleString("fi-FI");
	}
	function korkoakorolle(aloitus, vuosia, tuotto, kuukausisumma) {
		const kuukausia = 12 * vuosia, kerroin = Math.pow(1 + tuotto / 100, 1 / 12) - 1;
		let pääoma = aloitus, korko = 0, koronkorko = 0;
		for (let i = 0; i < kuukausia; ++i) {
			pääoma += kuukausisumma;
			koronkorko += kerroin * (korko + koronkorko);
			korko += kerroin * pääoma;
		}
		return {pääoma, korko, koronkorko, summa: pääoma + korko + koronkorko};
	}
	function laske() {
		const byId = id => document.getElementById(id);
		const aloitus = +byId("data-aloitus").value;
		const aika = +byId("data-aika").value;
		const tuotto = +byId("data-tuotto").value;
		const kuukausisumma = +byId("data-kuukausisumma").value;
		const tulos = korkoakorolle(aloitus, aika, tuotto, kuukausisumma);
		byId("tulos-aika").textContent = aika;
		byId("tulos-summa").textContent = näytäLuku(tulos.summa);
		byId("tulos-sijoitukset").textContent = näytäLuku(tulos.pääoma);
		byId("tulos-korko").textContent = näytäLuku(tulos.korko);
		byId("tulos-koronkorko").textContent = näytäLuku(tulos.koronkorko);
		byId("tulos-sijoitukset-p").textContent = näytäLuku(tulos.pääoma / tulos.summa * 100, 1);
		byId("tulos-korko-p").textContent = näytäLuku(tulos.korko / tulos.summa * 100, 1);
		byId("tulos-koronkorko-p").textContent = näytäLuku(tulos.koronkorko / tulos.summa * 100, 1);
	}
	function luvuksi() {
		this.parentNode.querySelector("[type=number]").value = this.value;
		laske();
	}
	for (const e of document.querySelectorAll("input[type=range]")) {
		e.addEventListener("change", luvuksi);
		luvuksi.apply(e);
	}
	for (const e of document.querySelectorAll("input[type=number]")) {
		e.addEventListener("change", laske);
	}
});
</script>

Grez [09.10.2021 16:35:31]

#

Perinteinen päässälaskukaava on käyttää lukua 72 ja sen kun jakaa koroilla prosenteissa, niin saa tiedon että montako vuotta menee pääoman tuplaantumisessa. Pitää kohtuullisen hyvin paikkansa realistisilla koroilla.

Toki kannattaa myös huomioida inflaatio. Käytännössä jos tuotto on 5% ja inflaatio 5% niin tuotolla saa vasta inflaation kuitattua ja pääoman reaaliarvo ei kasva.

Vastaus

Muista lukea kirjoitusohjeet.
Tietoa sivustosta