Zum Inhalt springen

Websiteentwicklung: JavaScript: Objekte: Math: Lösungen

Aus Wikibooks

Lösungen zu das Math-Objekt

Aufgabe 1 : Würfel-Simulation

[Bearbeiten]

Eine der (vielen denkbaren) Lösungen sieht zum Beispiel folgendermaßen aus:



<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Zufallszahlen / Würfel</title>
    <meta name="description" content="Zufallszahlen / Würfel">
    <meta name="author" content="moeller">
    <meta name="keywords" content="Zufallszahlen, Würfel">
    <script language="JavaScript">
        <!--
          var Z=new Array(12);
          var nW=0;
          function fW()
            {
            var x=Math.random()*6;
            x=Math.ceil(x);
            return x
            }
          function fWW()
             {
             var iSu=fW();
             iSu=iSu + fW();
             return iSu;
             }
          function fAusgabe()
             {
             with(document)
                {
                open();
                write("<h2>Simulation des Wurfs mit 2 Würfeln durch einen Zufallszahlen-Generator </h2><br>");
                write("<h3>Die Auswertung für " + nW + " Würfe :</h3>");
                write("<table border=\"1\">");
                write("<tr><td>Augensumme</td><td>Häufigkeit</td><td>Häufigkeit in %</td><td>Grafische Darstellung</td></tr>");
                var Zeile="";
                var pz=0;
                var pb=0;
                for(var i=2;i<=12;i++)
                   {
                   write("<tr>");
                   Zeile="<td align=\"right\">" +i + "</td>";
                   Zeile=Zeile + "<td align=\"right\">" + Z[i]+ "</td>";
                   pz=100*(Z[i]/nW);
                   pz=Math.round(100*pz)/100;
                   pb=Math.round(pz*10);
                   Zeile=Zeile + "<td align=\"right\">" + pz +" % </td>";
                   Zeile=Zeile + "<td><img src=\"../Grafik/JavaScript_Balken.jpg\" width=\"" + pb + "\" height=\"20\" alt=\"Balken\"></td>"
                   write(Zeile);
                   write("</tr>");
                   }
                write("</table>");
                close();
                }
             }
          function fWurfReihe()
             {
             nW=parseInt(prompt("Anzahl der Versuche : "));
             var x=0;
             for(var i=1;i<=12;i++)
                {
                Z[i]=0;
                }
             for(var i=1;i<=nW;i++)
                {
                x=fWW();
                Z[x]=Z[x]+1;
                }
             fAusgabe();
             }
        //-->
    </script>
    <noscript>Bitte schalten Sie JavaScript ein</noscript>
  </head>
  <body>
     <h2>Simulation des Wurfs mit 2 Würfeln durch einen Zufallszahlen-Generator </h2>
     <br>
     <form name="Form1" action="JavaScript_Wuerfel.html" method="post">
        <input type="button" name="btnStart" value="Start" onClick="fWurfReihe()"></input>
     </form>
  </body>
</html>

Programm testen

Aufgabe 2 : Taschenrechner

[Bearbeiten]

Hoffentlich hatten Sie viel Spaß mit Ihrem Taschenrechner! Wenn noch nicht alles so geklappt hat, wie Sie sich das gedacht haben: Hier ist eine funktionsfähige Lösung. Sie lässt sich sicher noch optimieren und erweitern (eine Aufgabe für später) - aber sie funktioniert. Sogar die „mathematischen Sündenfälle“ - Division durch 0 und Wurzeln aus negativen Zahlen sind abgefangen. Wenn Sie also mit Ihrer Lösung vergleichen wollen - wenn hier ein anderer Code steht, muss das nicht heißen, dass dieser besser ist - viele Wege führen nach Rom.

Das Programmbeispiel funktioniert auf Ihrem Rechner nur, wenn die Grafiken im Unterverzeichnis „/Grafik/“ abgelegt und auch so benannt sind, wie im Beispiel-Code.



<html>
  <head>
    <title>Taschenrechner</title>
    <meta name="description" content="Taschenrechner">
    <meta name="author" content="S.moeller">
    <meta name="keywords" content="Taschenrechner, Rechner, Calculator">
    <style type=text/css>
      input {text-align:right}
    </style>
    <script type="text/javascript" language="JavaScript">
        <!--
          var M=0;
          var X=0;
          var Y=0;
          var Z=0;
          var RA="";
          var RegAnz=0;
          var bOver=false;
          function txtClear()
            {
            document.frmCalc.txtDisplay.value=""
            bOver=false;
            }
          function fRegXY()
             {
             Y=X;
             X=parseFloat(document.frmCalc.txtDisplay.value);
             RegAnz++;
             //alert("X=" + X + " Y = " + Y + "RegAnz = " + RegAnz)
             }
         function fBerechne()
            {
            fRegXY();
            bOver=true;
            bERR=false;
            if(RegAnz>1)
               {
                  switch(RA)
                     {
                     case "+":
                        Y =Y + X;
                        break;

                     case "-":
                        Y =Y - X;
                        break;

                     case "*":
                        Y =Y * X;
                        break;

                     case "/":
                        if(X!=0)
                           {
                           Y =Y / X;
                           }
                        else
                           {
                           document.frmCalc.txtDisplay.value="ERROR - Division durch 0";
                           bERR=true;
                           }
                        break;

                     case "%":
                        //alert("X = " + X + " Y = " + Y + "RA = " + RA)
                        Y =Y * (1+(X/100));
                        break;

                     }
                  if(!bERR)
                     {
                     document.frmCalc.txtDisplay.value=Y;
                     }
               }
            }

          function fGleich()
            {
            fBerechne();
            Y=0;
            X=0;
            bOver=true;
            RegAnz=0;
            }
          function fBtnC()
            {
            document.frmCalc.txtDisplay.value="0"
            X=0;
            Y=0;
            RA="";
            RegAnz=0;
            }
          function fBtnCE()
            {
            document.frmCalc.txtDisplay.value="0"
            }
          function fBtnPM()
            {
            document.frmCalc.txtDisplay.value=parseFloat(document.frmCalc.txtDisplay.value)*(-1);
            }
          function fPlus()
            {
            RA="+"
            fBerechne();
            }
          function fMinus()
            {
            RA="-"
            fBerechne();
            }
          function fMulti()
            {
            RA="*"
            fBerechne();
            }
          function fDivi()
            {
            RA="/"
            fBerechne();
            }
          function fProz()
            {
            RA="%"
            M=0;
            }
          function fMPlus()
            {
            M=M + parseFloat(document.frmCalc.txtDisplay.value);
            if(M!=0)
               {
               document.frmCalc.MCtrl.src="../Grafik/MVoll.png"
               }
            else
               {
               document.frmCalc.MCtrl.src="../Grafik/MLeer.png"
               }
            document.frmCalc.txtMDisplay.value=M;
            }
          function fMMinus()
            {
            M=M - parseFloat(document.frmCalc.txtDisplay.value);
            if(M!=0)
               {
               document.frmCalc.MCtrl.src="../Grafik/MVoll.png"
               }
            else
               {
               document.frmCalc.MCtrl.src="../Grafik/MLeer.png"
               }
            document.frmCalc.txtMDisplay.value=M;
            }
          function fMRecall()
            {
            document.frmCalc.txtDisplay.value=M;
            }
          function fMSave()
            {
            M=parseFloat(document.frmCalc.txtDisplay.value);
            if(M!=0)
               {
               document.frmCalc.MCtrl.src="../Grafik/MVoll.png"
               }
            else
               {
               document.frmCalc.MCtrl.src="../Grafik/MLeer.png"
               }
            document.frmCalc.txtMDisplay.value=M;
            }
          function fMClear()
            {
            M=0;
            document.frmCalc.MCtrl.src="../Grafik/MLeer.png"
            document.frmCalc.txtMDisplay.value=M;
            }
          function fBtnN(iN)
            {
            if(bOver)
               {
               txtClear();
               }
            document.frmCalc.txtDisplay.value=document.frmCalc.txtDisplay.value + iN;
            }
          function fBtnDK()
            {
            document.frmCalc.txtDisplay.value=document.frmCalc.txtDisplay.value + ".";
            }
          function fPi()
            {
            document.frmCalc.txtDisplay.value=Math.PI;
            bOver=false;
            }
          function fE()
            {
            document.frmCalc.txtDisplay.value=Math.E;
            bOver=false;
            }
          function fBtnBack()
            {
            var sTmp=document.frmCalc.txtDisplay.value;
            var iLg=sTmp.length;
            if (iLg>0)
               {
               var sT=sTmp.substring(0,(iLg-1))
               document.frmCalc.txtDisplay.value=sT;
               }
            }
          function fSqrt()
            {
            var tmp=parseFloat(document.frmCalc.txtDisplay.value);
            if(tmp>=0)
               {
               document.frmCalc.txtDisplay.value=Math.sqrt(tmp);
               }
            else
               {
               document.frmCalc.txtDisplay.value="ERROR - Wurzel aus Zahl < 0!";
               }
            RegAnz=0;
            bOver=true;
            }
          function fKehr()
            {
            tmp=parseFloat(document.frmCalc.txtDisplay.value);
            if(tmp!=0)
               {
               document.frmCalc.txtDisplay.value=1/tmp;
               }
            else
               {
               document.frmCalc.txtDisplay.value="ERROR - Division durch 0!";
               }
            RegAnz=0;
            //txtAlignRight();
            bOver=true;
            }
        //-->
    </script>
    <noscript>Schade - hier geht es um JavaScript</noscript>
  </head>
  <body>
  <h3>Taschenrechner</h3>
    <form action="JavaScript_Calculator.html" method="get" name="frmCalc">
        <table >
                <tr>
                 <th colspan="6">      <input type="text" name="txtDisplay" value="" size="30" maxlength="30"></th>
                </tr>
                <tr>
                 <td><img src="../Grafik/MLeer.png" name="MCtrl" width="30" height="30"
                  border="0" alt="MCtrl"></td>
                 <th colspan="5"><input type="Text" name="txtMDisplay" value=""
                  size="25" readonly</th>
                </tr>
                <tr>
                 <td><img src="../Grafik/MC.png" width="30" height="30" border="0"
                  alt="MC" onClick="fMClear()" name="btnMC"></td>
                 <td><img src="../Grafik/E.png" width="30" height="30" border="0"
                  alt="7" onClick="fE()" name="btnE"></td>
                 <td><img src="../Grafik/PI.png" width="30" height="30" border="0"
                  alt="8" onClick="fPi()" name="btnPi"></td>
                 <td><img src="../Grafik/BackSpace.png" width="30" height="30" border="0"
                  alt="B" onClick="fBtnBack()" name="btnBack"></td>
                 <td><img src="../Grafik/CE.png" width="30" height="30" border="0"
                  alt="CE" onClick="fBtnCE()" name="btnCE"></td>
                 <td><img src="../Grafik/C.png" width="30" height="30" border="0"
                  alt="C" onClick="fBtnC()" name="btnC"></td>
                </tr>
                <tr>
                 <td><img src="../Grafik/MR.png" width="30" height="30" border="0"
                  alt="MC" onClick="fMRecall()" name="btnMRecall"></td>
                 <td><img src="../Grafik/7.png" width="30" height="30" border="0"
                  alt="7" onClick="fBtnN(7)" name="btnN"></td>
                 <td><img src="../Grafik/8.png" width="30" height="30" border="0"
                  alt="8" onClick="fBtnN(8)" name="btnN"></td>
                 <td><img src="../Grafik/9.png" width="30" height="30" border="0"
                  alt="9" onClick="fBtnN(9)" name="btnN"></td>
                 <td><img src="../Grafik/Divi.png" width="30" height="30" border="0"
                  alt="/" onClick="fDivi()" name="btnDivi"></td>
                 <td><img src="../Grafik/SQRT.png" width="30" height="30" border="0"
                  alt="W" onClick="fSqrt()" name="btnSqrt"></td>
                </tr>
                <tr>
                 <td><img src="../Grafik/MS.png" width="30" height="30" border="0"
                  alt="MS" onClick="fMSave()" name="btnSave"></td>
                 <td><img src="../Grafik/4.png" width="30" height="30" border="0"
                  alt="4" onClick="fBtnN(4)" name="btnN"></td>
                 <td><img src="../Grafik/5.png" width="30" height="30" border="0"
                  alt="5" onClick="fBtnN(5)" name="btnN""></td>
                 <td><img src="../Grafik/6.png" width="30" height="30" border="0"
                  alt="6" onClick="fBtnN(6)" name="btnN"></td>
                 <td><img src="../Grafik/Multi.png" width="30" height="30" border="0"
                  alt="*" onClick="fMulti()" name="btnMulti"></td>
                 <td><img src="../Grafik/Proz.png" width="30" height="30" border="0"
                  alt="%" onClick="fProz()" name="btnProz"></td>
                </tr>
                <tr>
                 <td><img src="../Grafik/MMinus.png" width="30" height="30" border="0"
                  alt="M+" onClick="fMMinus()" name="btnMMinus"></td>
                 <td><img src="../Grafik/1.png" width="30" height="30" border="0"
                  alt="1" onClick="fBtnN(1)" name="btnN"></td>
                 <td><img src="../Grafik/2.png" width="30" height="30" border="0"
                  alt="2" onClick="fBtnN(2)" name="btnN"></td>
                 <td><img src="../Grafik/3.png" width="30" height="30" border="0"
                  alt="3" onClick="fBtnN(3)" name="btnN"></td>
                 <td><img src="../Grafik/Minus.png" width="30" height="30" border="0"
                  alt="-" onClick="fMinus()" name="btnMinus"></td>
                 <td><img src="../Grafik/Kehr.png" width="30" height="30" border="0"
                  alt="1/x" onClick="fKehr()" name="btnKehr" name="btnKehr"></td>
                </tr>
                <tr>
                 <td><img src="../Grafik/MPlus.png" width="30" height="30" border="0"
                  alt="M+" onClick="fMPlus()" name="btnMPlus"></td>
                 <td><img src="../Grafik/0.png" width="30" height="30" border="0"
                  alt="0" onClick="fBtnN(0)" name="btnN"></td>
                 <td><img src="../Grafik/PlusMinus.png" width="30" height="30" border="0"
                  alt="+/-" onClick="fBtnPM()" name="btnPM"></td>
                 <td><img src="../Grafik/DK.png" width="30" height="30" border="0"
                  alt="," onClick="fBtnDK()" name="btnDK"></td>
                 <td><img src="../Grafik/Plus.png" width="30" height="30" border="0"
                  alt="+" onClick="fPlus()" name="btnPlus"></td>
                 <td><img src="../Grafik/Gleich.png" width="30" height="30" border="0"
                  alt="=" onClick="fGleich()" name="btnGleich"></td>
                </tr>
                </table>
  </body>
</html>

Programm testen