Funktion zentral ablegen

Jofre

Erfahrenes Mitglied
Einen schönen Sonntag,

Ich habe eine Funktion mit der die abgelaufene Zeit ermittelt wird. Da ich sie in verschiedenen Projekten verwenden möchte, möchte ich sie zentral ablegen und dann in den jeweiligen Projekt - Programmen aufrufen.
Wie bekomme ich jetzt die Werte zsecs usw , die in dem folgenden Code mit console.log ausgewiesenwerden, so, dass ich sie mit Canvas/ fillText nutzen kann?

Und kann ich irgendwie verhindern, dass in jedem der einzelnen Programme stopmich extra definiert werden muss.
Javascript:
var stopmich=false;

stoppenZeit(stopmich);

function stoppenZeit(stopmich)
{
var myVar;
    if (stopmich===false)
    {
        var zsecs=0,secs=0,minu=0,hrs=0;
        myVar = setInterval(myTimer,60);

        function myTimer()
        {
            zsecs++;    
            if (zsecs === 10)
                {
                    zsecs = 0;
                    secs++;
                }
            if (secs === 60)
                {
                minu++;
                secs = 0;
                }
            console.log(" zsecs " + zsecs + "  secs " +  secs + "  min  " + minu );  
        }
    }

    else
        {
        clearInterval(myVar);
        }
}

GuG
Joachim Freese
 
Zuletzt bearbeitet von einem Moderator:
Nur zur Verdeutlichung:

Es soll nicht einmalig die Zeit angezeigt werden sonder die verbauchte Zeit soll "laufen" Wie die Anzeige eines Stromzählers als Beispiel
 
Und kann ich irgendwie verhindern, dass in jedem der einzelnen Programme stopmich extra definiert werden muss.
Ja. Am einfachsten bedient man sich dazu eines Package Managers der jeweiligen Sprache. In JavaScript und Node.js ist etwa NPM der bekannteste Package Manager.
Ich würde also ein (ggf. lokales) NPM Package mit dieser Funktion erstellen und das in deinen Projekten dann installieren via `npm install my-local-package`.
Falls du noch keinen NPM Workflow + Build System in deinem Projekt hast, ist diese Umstellung durchaus mit Zeit verbunden! In einer deployedten Website kannst du nämlich kein NPM Paket ohne Weiteres require()en ("importieren"). Dafür gibt es aber Tools. Ich nenn mal keins, weil ich auch nicht weiß, welches aktuell gehyped wird :)
Du findest solche Tools unter den Stichwörtern "JavaScript build system", "build management", "HTML packaging", "webpack".
 
Ich möchte die "zentrale" Funktion ganz einfach unter z.B.
<script src="js/standard.js"></script>
ablegen.
 
Wie bekomme ich jetzt die Werte zsecs usw , die in dem folgenden Code mit console.log ausgewiesenwerden, so, dass ich sie mit Canvas/ fillText nutzen kann?
Das verstehe ich so, dass Du die Werte, die innerhalb der Funktion ermittelt werden, zum Zeichnen auf dem Canvas benutzt werden? In dem Fall würde ich vorschlagen, der Funktion stoppenZeit ein Callback-Funktion zu übergeben, die das Zeichnen erledigt, etwa so:
Code:
function stoppenZeit(stopmich, callback)
{
var myVar;
    if (stopmich===false)
    {
        var zsecs=0,secs=0,minu=0,hrs=0;
        myVar = setInterval(myTimer,60);

        function myTimer()
        {
            zsecs++;
            if (zsecs === 10)
                {
                    zsecs = 0;
                    secs++;
                }
            if (secs === 60)
                {
                minu++;
                secs = 0;
                }
            console.log(" zsecs " + zsecs + "  secs " +  secs + "  min  " + minu );
            callback(zsecs, secs, minu);
        }
    }

    else
        {
        clearInterval(myVar);
        }
}
Und dann dort, wo gezeichnet wird, bereitstellen und übergeben:
function drawTime(zsecs, secs, minu) {
// Hier stehen die Werte zur Verfügung und Du kannst sie
// auf dein Canvas zeichnen
}
// Timer starten und diese Funktion übergeben
stoppenZeit(false, drawTime);
(ungetestet)

Edit: Mir fällt gerade auf, dass es mit dem Stoppen des Timers Probleme geben könnte. Lösung entweder, indem man ein Objekt verwendet, so dass die Timervariable später verfügbar ist, oder sie im aufrufenden Code bereit stellen und ebenfalls als Parameter übergeben.
 
Zuletzt bearbeitet:
Danke Dir.

Genau was ich suchte.

Mit dem Stoppen gibt es wie du schon vorausgesehen hast Probleme. Ich habe es kurzfristig gelöst indem ich die Variable myVar im obigen Code entfernt und sie global gesetzt habe. Ist wahrscheinlich nicht elegant. Wie würde es denn funktionieren indem man ein Objekt verwendet?

u
 
Nein, das ist wirklich nicht so elegant. Mit einem Objekt könnte es so aussehen:
Code:
    <script>
        function stoppenZeit(callback) {
            var timer;
            var zsecs = 0, secs = 0, minu = 0, hrs = 0;
            function myTimer() {
                zsecs++;
                if (zsecs === 10) {
                    zsecs = 0;
                    secs++;
                }
                if (secs === 60) {
                    minu++;
                    secs = 0;
                }
                callback(zsecs, secs, minu);
            }
            this.start = function () {
                timer = setInterval(myTimer, 60);
            }
            this.stop = function () {
                clearInterval(timer);
            }
        }
        function drawTime(zsecs, secs, minu) {
            console.log(" zsecs " + zsecs + "  secs " + secs + "  min  " + minu);
        }
        var timer = new stoppenZeit(drawTime);
        timer.start();
        setTimeout(function () {
            timer.stop();
        }, 2000);
    </script>
Das setTimeout unten war nur zum Test.
Den Code kann man leicht erweitern, z. B. um zu pausieren und später weiterlaufen zu lassen.
 
Ich möchte die "zentrale" Funktion ganz einfach unter z.B.
<script src="js/standard.js"></script>
ablegen.
Gut, dann musst du aber die JS-Datei in deine verschiedenen Projektordner immer wieder kopieren. Und du hast keine Versionsverwaltung. Das geht bei sehr kleinen Projekten noch gut, danach aber nicht mehr.

setInterval(myTimer, 60);
Solch kleinen Intervallwerte sehe ich generell kritisch. Warum braucht ihr das? Wenn ihr etwas Frame-für-Frame rendern wollt, benutzt stattdessen requestAnimationFrame. Diese wird bspw. nur aufgerufen, wenn der Tab aktiv ist und spart so Rechenleistung.
 
Es sind nur kleine Projekte. Alles ist noch überschaubar. Wenn nicht mehr, dann frag ich euch. Ihr habt es ja drauf!
Die Zeiteinheiten sind so klein gewählt damit die Uhr "rattert" und der Anwender unter Stress kommt.
Soll zur seiner Verbessrung / Erhaltung seiner geistigen Fitness beitragen

Vielen Dank noch mal Dir und Sempervivum.
 
Zurück