Java Script wie kann ich das dauerhaft wiederholen?

const cars = ["saab", "Volvo", "BMW", "Mercedes"];
async function timer() {

for (let i=0; i < cars.length; i++) {

    console.log(cars[i]);
    await sleep(2000);
}
}

timer();
function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

1 Antwort

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

HTML, JavaScript, Programmiersprache

21.02.2023, 13:45

Mit setInterval lässt es sich einfacher lösen. Sobald der Index am Ende des Arrays angelangt ist, braucht er nur wieder zurückgesetzt werden.

const cars = ["saab", "Volvo", "BMW", "Mercedes"];
let index = 0;

setInterval(() => {
  console.log(cars[index]);
  ++index;

  if (index >= cars.length) {
    index = 0;
  }
}, 2000);

tres2020

Beitragsersteller

21.02.2023, 16:00

gibt es keine möglichkeit es auch mit der funktion zu machen die ich benutzt habe villeicht eine while schleife mit einer if zu benutzen?

regex9

21.02.2023, 16:16

@tres2020

Ja, du kannst auch eine Endlosschleife bauen, in der die Aktionen durchgeführt werden.

tres2020

Beitragsersteller

21.02.2023, 16:31

@regex9

Wärst du so lieb und würdest das mal für mich machen :) kriege es selbst nicht hin

regex9

21.02.2023, 16:34

@tres2020

Zeige einmal deinen Stand mit der while-Schleife und woran es konkret scheitert.

tres2020

Beitragsersteller

21.02.2023, 16:51

@regex9

Hat jetzt doch funktioniert nach paar mal probieren danke

tres2020

Beitragsersteller

21.02.2023, 13:51

danke :)

tres2020

Beitragsersteller

21.02.2023, 13:51

@tres2020

funktioniert

Ähnliche Beiträge

JavaScript Await Async, Wo ist der Fehler?

function test1(zahl) {
    setTimeout(() => {
        return(zahl *2)
    }, 5000);
  }
async function test2() {
let x = await test1(2);
}
test2().then.alert(x)

Output: ReferenceError: x is not defined

Wollte das eigentlich so machen das die Funktion Test2 wartet bis die Funktion Test1 fertig ist, das sind jetzt zum Beispiel 5 Sekunden.

Und dann soll es x alerten.

Also möchte so tun als würde etwas länger dauern als geplant.

Könnten ja auch 10 Sekunden sein, die Hauptsache ist das wartet bis es die Antwort bekommen hat.

(Ich habe Async und Await nicht wirklich verstanden, und dachte mir das es so Funktioniert und ein gutes Beispiel ist)

...zum Beitrag

Javascript setTimeout Wiederholungen?

Schaut mal bitte folgendes Beispiel

var update=0;
function ReloadFunktionen()
{
 console.log(update);
 update=setTimeout(ReloadFunktionen, 1000);
}
ReloadFunktionen();

Die console.log Info zeigt mir das der Wert der Variable "update" am steigen ist, die Zahl wird immer groeser, ich frage mich ob dadurch mit der Zeit vielleicht der Browser immer mehr Speicher verbraucht, ob ich das falsch aufgebaut habe oder ob das normal ist das die Zahl welche setTimeout zurueck gibt immer weiter steigt.

Im Prinzip will ich das ganze als Endlosschleife benutzen damit bestimmte Funktionen immer wieder neu aufgerufen werden nach Ablauf von paar Sekunden.

...zum Beitrag

Wie könnte ich dieses Problem mit einer Callback-Funktion lösen?

Hallo, ich lese gerade etwas zu Callback-Funktionen in der asynchronen Programmierung und frage mich bei folgendem Beispiel, wie ich dafür sorgen kann, dass - trotz Verzögerung per setTimeout() - Aufgabe 1 vor Aufgabe 2 aufgerufen wird. Ich glaube, dass Callback-Funktionen hier eine Lösung sein könnten, aber die Umsetzung verstehe ich noch nicht so ganz.

function taskOne() {
    console.log("Aufgabe 1");
}


setTimeout(taskOne, 3000);




function taskTwo() {
    console.log("Aufgabe 2");
}


taskTwo();

//Ergebnis:
Aufgabe 2
//3 Sekunden delay
Aufgabe 1

...zum Beitrag

Werte aus Datenbank anzeigen mit JS?

Hallo,

ich habe folgenden Code für mein Formular:

<form action="/message1" method="post">
  <div class="input">
    <input type="text" placeholder="Chat" id="input" name="input1">
  </div>
  <div class="send">
    <button type="submit" onclick="message();">Send</button>
  </div>
</form>

Nun noch das JS onclick-Event:

function message() {
  input = document.getElementById("input").value;
  count++;

  if (input == "") {
    alert("please type your message!");
  }
  else {
    if (count % 2 == 0) {
      let newDiv = document.createElement("div");
      newDiv.id = "divMessage";
      newDiv.style.display = "flex";
      newDiv.style.justifyContent = "flex-start";
      newDiv.style.margin = "45px";
      newDiv.style.backgroundColor = "#303032";
      newDiv.style.borderRadius = "10px";
      newDiv.style.padding = "10px";
      newDiv.style.marginTop = "80px";
      newDiv.style.color = "white";
      newDiv.style.marginBottom = "80px";
      newDiv.style.width = "120px";
      newDiv.innerHTML = input;

      let chatMessages = document.querySelector(".chat-messages");
      chatMessages.appendChild(newDiv);
    }

Und nun noch das Reinschreiben mit node.js in die MariaDB-Datenbank:

app.post('/message1', async (req, res) => {
  const input = req.body.input1;
  console.log(input);
  const conn = await pool.getConnection();
  await conn.query(`INSERT INTO test.handy (id, name) VALUES (2, '${input}')`);
  conn.release();
});

Nun möchte ich aber, das, was in die Datenbank geschrieben wurde, beim Aktualisieren der Seite immer noch im "newDiv" anzeigen. Wie geht das?

...zum Beitrag

Javascript undefined nach funktion?

Hallo,

ich möchte einen webScraper schreiben, nachdem ich hier aber die init() für die browser und page instanzen aufrufe, werden die als undefined zurückgeliefert. Innerhalb der funktion ist typeof browser und page "object", wenn ich die Werte dann ausserhalb aufrufen möchte, sind sie "undefined". Ich benutze Nodejs und Puppeteer

async function init() {
  try {
    browser = await puppeteer.launch({
      headless: true,
      args: ["--disable-setuid-sandbox"],
      ignoreHTTPSErrors: true,
    });
    page = await browser.newPage();
    console.log(typeof browser);
    console.log(typeof page);
  } catch (err) {
    console.log(err.message);
  }
  return {
    first: page,
    second: browser,
  };
}
var retvals = init();
browser = retvals.second;
page = retvals.first;
console.log("here: ");
console.log(typeof retvals.second);
console.log(typeof retvals.first);
scrapeSite(urls[0]);

Verstehe nicht wirklich, was daran nicht funktionieren sollte, liegt aber vermutlich daran, dass ich wenig JS kenntnisse habe :D

MfG und danke im Voraus.

...zum Beitrag

JavaScript warten, bis sich Variable ändern?

Ich habe ein Formular mit einem Submit-Button.

<button onClick={() => submitHandler("fromSubmitButton")}>Submit</button>

Die submitHandler Funktion sendet über einen Websocket eine Nachricht an den Server, ohne eine direkte Antwort zu bekommen, wie es mit async/await funktionieren würde:

socket.emit('email-submit', value)

Nach einiger Zeit kommt vom Server bzw. Websocket eine Nachricht:

        socket.on('badEmailORphone', function(msg) {
            setBadEmailORphone(msg)
        });

In der Zeit zwischen dem Klick auf Submit und setBadEmailORphone gesetzt wird, möchte ich einen Ladescreen einblenden.

Rein logisch müsste ich den Ladescreen ab Klick auf den Submit-Button bis setBadEmailORphone setzen, aber wie kann ich in JavaScript x Sache machen, bis sich eine Variable ändert?

Meine erste Theorie war:

Submit onClick:

while(!setBadEmailOrphone) setLoading(true) //Mit etwas Delay zwischen Durchläufen

...zum Beitrag

Electron Datei Öffnen und Inhalt in Script übergeben?

Ich möchte in meinem Electron Programm im Menü die Möglichkeit bieten eine Datei zu öffnen. Die Datei enthält JSON. Ich möchte den Inhalt dann in meinem Script weiterverarbeiten um ihn anzuzeigen. Das ist mein Code bis jetzt:

main.js

const { app, BrowserWindow, Menu } = require('electron');
const { mainMenu } = require('./menu');
const path = require('path');


const createWindow = () => {
    const mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js'),
        },
    });


    Menu.setApplicationMenu(mainMenu);


    mainWindow.loadFile(path.join(__dirname, "src/index.html"));
};


app.whenReady().then(() => {
    createWindow();


    app.on('activate', () => {
        if (BrowserWindow.getAllWindows().length === 0) {
            createWindow();
        }
    });
});


app.on('window-all-closed', () => {
    if (process.platform !== 'darwin') {
        app.quit();
    }
});

menu.js

const { app, Menu, dialog } = require('electron');
const fs = require('fs');


const template = [
    {
        label: 'Datei',
        submenu: [
            {
                label: 'Öffnen',
                accelerator: 'CmdOrCtrl+O',
                click: async () => {
                    const files = await dialog.showOpenDialog({
                        properties: ['openFile'],
                        filters: [
                            { name: 'Json', extensions: ['json'] },
                            { name: 'Alle Dateien', extensions: ['*'] }
                        ]
                    });


                    if (!files || files.canceled || files.filePaths.length === 0) return


                    const file = files.filePaths[0];
                    const fileContent = fs.readFileSync(file, 'utf-8');
                    console.log(fileContent);
                }
            }
        ]
    }
]


module.exports.mainMenu = Menu.buildFromTemplate(template);

index.html (src/index.html)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>Seite</h1>
    <script>
        console.log(data);
    </script>
</body>
</html>

Wie kann ich das umsetzten? Ich habe schon von IPC gelesen, es aber nicht wirklich verstanden.

...zum Beitrag

Warum funktioniert Flask und Websockets nicht?

Hallo,

ich wollte meinen Python- Code mit meinem HTML- Code verbinden, damit, wenn mein Wake- Word "Luna" erkannt wurde, der Hintergrund der Datei output.html seine Farbe ändert und rot wird. Hier ist der Code:

Python:

from flask import Flask, render_template
from flask_socketio import SocketIO

app = Flask(__name__)
socketio = SocketIO(app)


@app.route('/')
def index():
    return render_template('index.html')


@socketio.on('connect')
def handle_connect():
    print("Client verbunden")


@socketio.on('disconnect')
def handle_disconnect():
    print("Client getrennt")


@socketio.on('change_background')
def change_background(color):
    print("Hintergrundfarbe ändern:", color)
    socketio.emit('background_changed', color)

HTML /CSS:

... body {
  background-color: black;
  margin: 0;
  padding: 0;
  text-align: center;
  overflow-x: hidden;
  overflow-y: hidden;
    -webkit-user-select: none; /* Für WebKit-Browser */
    -moz-user-select: none; /* Für Mozilla-basierte Browser */
    -ms-user-select: none; /* Für Microsoft Edge */
    user-select: none;
}  
</style>
</head>
<body>

JavaScript:

... // FLASK
    var socket = io();

    socket.on('connect', function() {
        console.log('Verbunden mit dem Server');
    });

    socket.on('disconnect', function() {
        console.log('Verbindung zum Server getrennt');
    });

    socket.on('background_changed', function(color) {
        console.log('Hintergrundfarbe geändert:', color);
        document.body.style.backgroundColor = color;
    });
</script>
</body>
</html>
    """
    with open("output.html", "w") as html_file:
        html_file.write(html_content)

    return "output.html"

Wenn ich den Code aber ausführe und "Luna" sage, ändert der Hintergrund nicht seine Farbe. Woran liegt das?

Freundliche Grüsse

...zum Beitrag

Minecraft uuid to username auf Website?

Hey ich habe das Problem das immer der Error kommt:

Access to fetch at 'https://api.mojang.com/user/profile/7a6b1f5a-753a-4fc1-b6a7-b70a0ed090ee' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

das ist mein code um den displayName zu bekommen:

 async function getMojangProfile(uuid) {
  try {
    const url = `https://api.mojang.com/user/profile/${uuid}`;
    const response = await fetch(url);
    if (!response.ok) throw new Error('Profil nicht gefunden');
    const data = await response.json();
    const displayName = data.name; // Der Name, wie in der API-Antwort enthalten
    return { ...data, displayName };
  } catch (error) {
    console.error(error);
    return null;
  }
}

Vielleicht hat ja jemand das schonmal gemacht, habe schon danach gesucht und auch chatgpt benutzt leider nichts bisher funktioniert

Vielen Dank im vorraus!

...zum Beitrag

Skript, um eine Taste beim gedrückt halten mehrfach zu drücken?

Guten Tag,

das hier ist ein JavaScript, welches dafür sorgt, dass ich, wenn ich eine Taste gedrückt halte, die Funktion mehrfach ausgeführt wird.

$(function () {
  const holdDelay = 82, // ms delay to start dropping after pressing
  dropDelay = 32 // ms delay between drops
  let keys = {};
  $(document).on("keydown", (e) => {
    // if (e.keyCode != $('#pellet').text().charCodeAt(0)) return;
    if (e.keyCode in keys) return;

    keys[e.keyCode] = setTimeout(() => {
      drop(e.keyCode);
    }, holdDelay);
  }).on("keyup", (e) => {
    clearTimeout(keys[e.keyCode]);
    delete keys[e.keyCode];
  });
  const drop = key => {
    if (keys[key] == null) return;

    window.onkeydown({ keyCode: key });
    window.onkeyup({ keyCode: key });
    setTimeout(drop, dropDelay, key);
  }
});

Weiß jemand, wie ich machen kann, dass das nur für eine Taste gilt?

...zum Beitrag

NextJS Server Component aktualisiert API-Daten nicht?

Hey Leute,

ich bin relativ neu in NextJS (nutze den AppRouter) und habe aktuell folgendes Problem:

Überblick:
Ich habe ein Server Component, welches eine Liste von Items darstellen soll, diese Items weden mit axios von einem externen Backend geladen.
Zudem habe ich noch ein Formular (auf einer anderen Seite), mit welchem ich neue Items hinzufügen kann.

Problem:
Wenn ich ein neues Item hinzufügen (egal ob über das Formular oder direkt in der Datenbank) und dann auf die Seite mit der Liste navigiere (oder umgeleitet werde), sehe ich die neuen Items nicht.
Ich muss zuerst einen vollständigen Reload über den Browser durchführen, damit die neuen Daten aus dem Backend geladen werden.

Meine Frage:
Bin ich zu doof das Server Component korrekt zu benutzen oder ist es einfach falsch, für ein solches Szenario Server Components zu nutzen und ich sollte einfach Client Components nutzen.

Relevanter Code:

const client = axios.create({
  baseURL: "http://localhost:9999"
})

async function getItems(): Promise<Item[]> {
  return client.get("/items")
    .then(response => response.data.items)
    .catch(error => {
      console.log(error);
    });
}

const ItemsList: FC = async () => {
  const items = await getItems();

  return (
    <>
      // rendering list
    </>
  );
};

export default ItemsList;

Mfg Jannick (L1nd)

...zum Beitrag

Javascript funktion um gewisse Uhrzeit, setinterval Ressourcen Belastung?

Hallo zusammen

Ich bräuchte eine function, welche immer um die gleiche Uhrzeit, jeden Tags ausgeführt wird. Jeden Tag um 23:59

Nun habe ich eine setInterval function welche jede sekunde ausgeführt wird. wenn die aktuelle uhrzeit 23:59:0 betrifft, wird die eigentliche function ausgeführt.

Meine Frage: Ist das sehr ressourcen verbrauchend, da jede sekunde abgefragt wird?

function tick() {
  //get the mins of the current time
  var mins = new Date().getMinutes();
  var sec = new Date().getSeconds();
  var hours = new Date().getHours();
  var time_stamp = "23:59:0";
  var time_stamp = "15:20:0";
  var current_time = hours + ":" + mins + ":" + sec;
  
  if (current_time == time_stamp) {
    alert('Do stuff');
  }
  console.log('Tick ' + hours + ":" + mins + ":" + sec);
}


setInterval(tick, 1000);

...zum Beitrag

Bilder bei jquery/JavaScript nach bestimmter zeit austauschen?

Erstmal entschuldigung für die komische Überschrift, ich schmeiße manchmal die beiden gerne durcheinander.

Ich hab auf meiner Seite einen Timer (fürs Beispiel 30s), der mit einem Button gestartet werden. Am Anfang soll Bild1 stehen. Nachdem der Timer bei der Hälfte der Zeit angekommen ist (hier 15s) soll Bild2 dort erscheinen wo Bild1 vorher war. Ist der Timer bei 0 angekommen, wird man auf eine andere Seite weitergeleitet.

Wie mache ich das am besten?

Hier mein bisheriger Code

$(document).ready(function (e) {

var $timer = $("#timer");

var stop = false;

var timerLoop;

$( "#button_start" ).click(function() {

timerLoop = setInterval(function(){ update() }, 1000);

});

function update() {

if(!stop){

var myTime = $timer.html();

var ss = myTime.split(":");

var dt = new Date();

dt.setHours(0);

dt.setMinutes(ss[0]);

dt.setSeconds(ss[1]);

var dt2 = new Date(dt.valueOf() - 1000);

var temp = dt2.toTimeString().split(" ");

var ts = temp[0].split(":");

if(ss[0] === "00" && ss[1] === "01"){

stop = true;

clearInterval(timerLoop);

$("body").load( "./erfolgreich.html" );

}

$timer.html(ts[1]+":"+ts[2]);

//setTimeout(update, 1000);

}

});

...zum Beitrag

NameError: name 'guild' is not defined?

import discord
import time
from discord.ext import commands
import random

intents = discord.Intents.default()
intents.message_content = True

client = discord.Client(intents=intents)

@client.event
async def on_ready():
    print(''' 

Bereit!

 ''')
    await client.change_presence(activity=discord.Game(name="Python 3.9"))

@client.event
async def on_message(message):
    if message.author == client.user:
        return

    while 5 > 1:
        if message.content.startswith('$py'):
            time.sleep(1)
            await message.channel.send('Hey')
            await message.channel.send('https://cdn.discordapp.com/emojis/1021051851967320114.webp?size=4096')
            await guild.create_text_channel('Python 3.9')
client.run('My Token')

error: await guild.create_text_channel('Python 3.9')

NameError: name 'guild' is not defined

...zum Beitrag

Was möchtest Du wissen?

Deine Frage stellen