07.10.2022, 13:52
Moin, wer Interesse hat kann sich ja gerne mal den JavaScript code anschauen, hab selbständig einen Taschenrechner programmiert und mir das selber angeeignet. Würde gerne ein paar Tipps bekommen von Profis, also wer möchte kann es sich gerne mal anschauen
Code:
let arrayergebnis = ["","","","",""];
let arrayzahl = ["","","","",""];
function Ergebnis() {
let x = eval(document.getElementById('Display').value) + ("");
let num = eval(document.getElementById('Display').value)
let arrayFrom = x.split('');
speicher();
if(arrayFrom.indexOf('.') == "-1" ) {
document.getElementById('Display').value = x;
}
if(arrayFrom.indexOf('.') == "1" ) {
let runden = document.getElementById('dezimal').value;
let fix = num.toFixed(runden);
document.getElementById('Display').value = fix;
}
document.getElementById('Displayausgabe1').value = arrayzahl[0];
document.getElementById('Displayausgabe2').value = arrayzahl[1];
document.getElementById('Displayausgabe3').value = arrayzahl[2];
document.getElementById('Displayausgabe4').value = arrayzahl[3];
document.getElementById('Displayausgabe5').value = arrayzahl[4];
speicherE();
let ergebnis = document.getElementById('Display').value
document.getElementById('DisplayausgabeE1').value = arrayergebnis[0];
document.getElementById('DisplayausgabeE2').value = arrayergebnis[1];
document.getElementById('DisplayausgabeE3').value = arrayergebnis[2];
document.getElementById('DisplayausgabeE4').value = arrayergebnis[3];
document.getElementById('DisplayausgabeE5').value = arrayergebnis[4];
}
function Hinzufuegen(Zeichen) {
let display = document.getElementById('Display').value;
document.getElementById('Display').value = display + Zeichen;
}
function loeschen() {
let display = document.getElementById('Display').value;
let end = display.length -1;
let result = display.substring (0, end);
document.getElementById('Display').value = result;
}
function loeschenkom() {
let display = document.getElementById('Display').value;
let end = display.length -528;
let result = display.substring (0, end);
document.getElementById('Display').value = result;
}
function speicher() {
let ausp = (document.getElementById('Display').value);
let arraybackup = [arrayzahl[0],arrayzahl[1],arrayzahl[2],arrayzahl[3],arrayzahl[4]]
arrayzahl[0] = ausp
arrayzahl[1] = arraybackup[0]
arrayzahl[2] = arraybackup[1]
arrayzahl[3] = arraybackup[2]
arrayzahl[4] = arraybackup[3]
}
function speicherE () {
let ergebnis = document.getElementById('Display').value
let arraybackupE = [arrayergebnis[0],arrayergebnis[1],arrayergebnis[2],arrayergebnis[3],arrayergebnis[4]]
arrayergebnis[0] = ergebnis
arrayergebnis[1] = arraybackupE[0]
arrayergebnis[2] = arraybackupE[1]
arrayergebnis[3] = arraybackupE[2]
arrayergebnis[4] = arraybackupE[3]
}
function rechnungback1 () {
let back = (document.getElementById('Displayausgabe1').value)
document.getElementById('Display').value = back;
}
function rechnungback2 () {
let back = (document.getElementById('Displayausgabe2').value)
document.getElementById('Display').value = back;
}
function rechnungback3 () {
let back = (document.getElementById('Displayausgabe3').value)
document.getElementById('Display').value = back;
}
function rechnungback4 () {
let back = (document.getElementById('Displayausgabe4').value)
document.getElementById('Display').value = back;
}
function rechnungback5 () {
let back = (document.getElementById('Displayausgabe5').value)
document.getElementById('Display').value = back;
}
function quadrat () {
let display = Math.pow(document.getElementById('Display').value, 2);
document.getElementById('Display').value = display;
}
function plusminus () {
let anzeige = document.getElementById('Display').value;
if(anzeige.indexOf('-') == "0" ) {
let dstring = anzeige.substring(1)
document.getElementById('Display').value =("+" + dstring);
}
if(anzeige.indexOf('-') == "-1" ) {
let dstring = anzeige.substring(0)
document.getElementById('Display').value =("-" + dstring);
}
if(anzeige.indexOf('+') == "0" ) {
let dstring = anzeige.substring(1)
document.getElementById('Display').value =("-" + dstring);
}
}
function prozent () {
let anzeige = document.getElementById('Display').value;
let berechnung = anzeige / 100
document.getElementById('Display').value = berechnung;
}
function sinus () {
let anzeige = Math.sin(document.getElementById('Display').value);
document.getElementById('Display').value = anzeige;
}
function cosinus () {
let anzeige = Math.cos(document.getElementById('Display').value);
document.getElementById('Display').value = anzeige;
}
Code:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<title>Taschenrechner</title>
<script id=text type="text/javascript" src="javascript.js"></script>
</head>
<header class="header">
<h1>Taschenrechner</h1>
</header>
<p>
<body>
<form>
<div class="links">
<table>
<tr>
<td>
<input size=28 type="text" id="Display" name="Display" align="right" class="display"></td><td>
</tr><tr>
<td>
<table>
<tr>
<td><input type="button" width="60" class="button" value=" % " onClick="prozent()"></td>
<td><input type="button" width="60" class="button" value=" x² " onClick="quadrat()"></td>
<td><input type="button" width="60" class="button" value=" +/- " onClick="plusminus()"></td>
<td><input type="button" width="60" class="button" value="sin " onClick="sinus()"></td>
<td><input type="button" width="60" class="button" value="cos " onClick="cosinus()"></td>
</tr>
<tr>
<td><input type="button" width="60" class="button" value=" 7 " onClick="Hinzufuegen('7')"></td>
<td><input type="button" width="60" class="button" value=" 8 " onClick="Hinzufuegen('8')"></td>
<td><input type="button" width="60" class="button" value=" 9 " onClick="Hinzufuegen('9')"></td>
<td><input type="button" width="60" class="button" value=" + " onClick="Hinzufuegen('+')"></td>
<td><input type="button" width="60" class="button" value=" ( " onClick="Hinzufuegen('(')"></td>
</tr>
<tr>
<td><input type="button" width="60" class="button" value=" 4 " onClick="Hinzufuegen('4')"></td>
<td><input type="button" width="60" class="button" value=" 5 " onClick="Hinzufuegen('5')"></td>
<td><input type="button" width="60" class="button" value=" 6 " onClick="Hinzufuegen('6')"></td>
<td><input type="button" width="60" class="button" value=" - " onClick="Hinzufuegen('-')"></td>
<td><input type="button" width="60" class="button" value=" ) " onClick="Hinzufuegen(')')"></td>
</tr>
<tr>
<td><input type="button" width="60" class="button" value=" 1 " onClick="Hinzufuegen('1')"></td>
<td><input type="button" width="60" class="button" value=" 2 " onClick="Hinzufuegen('2')"></td>
<td><input type="button" width="60" class="button" value=" 3 " onClick="Hinzufuegen('3')"></td>
<td><input type="button" width="60" class="button" value=" * " onClick="Hinzufuegen('*')"></td>
<td><input type="button" width="60" class="button" value=" < " onClick= "loeschen()"></td>
</tr>
<tr>
<td><input type="button" width="60" class="button" value=" 0 " onClick="Hinzufuegen('0')"></td>
<td><input type="button" width="60" class="button" value=" . " onClick="Hinzufuegen('.')"></td>
<td><input type="button" width="60" class="button" value=" = " onClick="Ergebnis()"></td>
<td><input type="button" width="60" class="button" value=" / " onClick="Hinzufuegen('/')"></td>
<td><input type="button" width="60" class="button" value=" C " onClick="loeschenkom ()"></td>
</tr>
<tr>
<label>Kommastellen:</label>
<select id="dezimal" size="1" title="ax" >
<option> 0 </option>
<option> 1 </option>
<option> 2 </option>
<option selected> 3 </option>
<option> 4 </option>
<option> 5 </option>
</select>
<!-- <input type="button" width="60" class="button" value=" back " onClick="rechnungback()"> -->
</tr>
</table>
</form>
</div>
</body>
<div class="rechts">
<input size=28 type="text" readonly id="Displayausgabe1" name="Display" align="right" class="display2">=<input size=10 type="text" readonly id="DisplayausgabeE1" name="Display" align="right" class="displayE2"><input size=2 type="button" readonly id="Displayausgab" value="Back" align="right" onClick="rechnungback1()" class="button"><p>
<input size=28 type="text" readonly id="Displayausgabe2" name="Display" align="right" class="display2">=<input size=10 type="text" readonly id="DisplayausgabeE2" name="Display" align="right" class="displayE2"><input size=2 type="button" readonly id="Displayausgab" value="Back" align="right" onClick="rechnungback2()" class="button"><p>
<input size=28 type="text" readonly id="Displayausgabe3" name="Display" align="right" class="display2">=<input size=10 type="text" readonly id="DisplayausgabeE3" name="Display" align="right" class="displayE2"><input size=2 type="button" readonly id="Displayausgab" value="Back" align="right" onClick="rechnungback3()" class="button"><p>
<input size=28 type="text" readonly id="Displayausgabe4" name="Display" align="right" class="display2">=<input size=10 type="text" readonly id="DisplayausgabeE4" name="Display" align="right" class="displayE2"><input size=2 type="button" readonly id="Displayausgab" value="Back" align="right" onclick="rechnungback4()" class="button"><p>
<input size=28 type="text" readonly id="Displayausgabe5" name="Display" align="right" class="display2">=<input size=10 type="text" readonly id="DisplayausgabeE5" name="Display" align="right" class="displayE2"><input size=2 type="button" readonly id="Displayausgab" value="Back" align="right" onclick="rechnungback5()" class="button">
</div>
<footer>
</footer>
</html>