Shelly-Skripte eröffnen zahlreiche Möglichkeiten, um dein Smart Home ganz individuell zu automatisieren – doch der Einstieg kann gerade für Anfänger eine Herausforderung sein. Dieser Beitrag wurde speziell für alle entwickelt, die wenig bis keine Programmiererfahrung haben und sich dennoch gerne näher mit dem Thema JavaScript auf Shelly-Geräten beschäftigen möchten.
Aus der Community kam der Wunsch, stärker auf die Grundlagen von JavaScript ES6 einzugehen – also genau die Sprache, die Shelly für eigene Automatisierungen verwendet. Diesem Wunsch komme ich sehr gerne nach!
In diesem Beitrag zeige ich dir Schritt für Schritt, wie du mit Variablen, Bedingungen und einfacher Logik deine ersten eigenen Skripte entwickeln kannst – praxisnah und direkt anwendbar auf deinem Shelly-Gerät.
Du hast selbst Wünsche, Ideen oder Anregungen zu einem bestimmten Thema? Dann hinterlasse mir gerne einen Kommentar oder sende mir ein Ticket über mein Supportformular:
👉 https://draeger-it.blog/support/
Inhaltsverzeichnis
- Erster Einstieg ins Shelly Scripting (am Beispiel Shelly 1 Gen4)
- Kommentare – Der Schlüssel zu verständlichem Code
- Variablen und Konstanten – Daten speichern und wiederverwenden
- Was macht print()?
- Bedingungen und Vergleichsoperatoren – Reagiere auf Zustände
- switch–case – Eine klare Alternative zu vielen if-Bedingungen
- Schleifenarten im Vergleich – Kopfgesteuert vs. Fußgesteuert
- Die for-Schleife – gezielte Wiederholungen mit Zähler
- Die while-Schleife – Wiederholen solange eine Bedingung gilt
- Die do…while-Schleife – erst ausführen, dann prüfen
- Funktionen – Code wiederverwenden und strukturieren
- Quellen & weiterführende Informationen
Erster Einstieg ins Shelly Scripting (am Beispiel Shelly 1 Gen4)
Bevor wir mit dem Programmieren loslegen, werfen wir einen kurzen Blick darauf, wie du überhaupt ein eigenes Skript auf deinem Shelly-Gerät erstellen kannst. Im folgenden Beispiel verwende ich einen Shelly 1 Gen4 mit der IP-Adresse 192.168.178.66.
Schritt 1 – Zugriff auf das Webinterface
Öffne einen Browser und gib die IP-Adresse deines Shelly-Geräts ein: http://192.168.178.66
Du wirst mit dem modernen WebUI begrüßt, das dir aktuelle Informationen wie Temperatur, Spannung und Schaltzustände anzeigt.
Auf der linken Seite findest du das Menü – dort klickst du auf den Punkt: Scripts
Schritt 2 – Ein neues Skript erstellen
Klicke auf den Button „Create script“, um ein neues Skript zu erzeugen.
Beim ersten Aufruf erscheint ein Hinweis, dass du das WebSocket Log aktivieren musst.
👉 Ab der Firmware-Version 20250410-085905/1.6.0-beta1-g2554734 genügt ein Klick auf „Enabled“, um das Log zu aktivieren. Danach bist du bereit.
Schritt 3 – Skript benennen und vorbereiten
Nun kannst du deinem Skript einen beliebigen Namen geben und es anschließend speichern.
Oben findest du das Eingabefeld für deinen Code (Markierung 5), unten siehst du das Log-Ausgabefenster mit den Rückmeldungen deines Skripts.
💡 Hinweis: Die Log-Ausgaben erscheinen mit Zeitstempel (Uhrzeit) – so erkennst du, wann genau ein Befehl ausgeführt wurde.
Schritt 4 – Skript starten und stoppen
Sobald dein Skript gespeichert wurde, erscheinen zusätzlich die Buttons „Start“ und „Stop“.
So kannst du dein Skript jederzeit manuell aktivieren oder deaktivieren – ideal zum Testen deiner Automatisierung.
Kommentare – Der Schlüssel zu verständlichem Code
Bevor wir mit den eigentlichen Befehlen und Variablen starten, werfen wir einen Blick auf etwas, das oft unterschätzt wird, aber später enorm wichtig ist: Kommentare.
Mit Kommentaren kannst du deinen Quellcode dokumentieren – also für dich selbst oder andere verständlich machen, was ein bestimmter Abschnitt macht und warum du ihn so geschrieben hast.
Shelly verwendet JavaScript in einer leicht angepassten Variante (mJS), und genau wie im klassischen JavaScript gibt es zwei Arten von Kommentaren:
Einzeilige Kommentare
Einzeilige Kommentare beginnen mit //. Alles, was danach in der Zeile steht, wird vom Shelly ignoriert.
// Diese Zeile schaltet das Relais ein
Shelly.call("Switch.Set", { id: 0, on: true });
Mehrzeilige Kommentare
Wenn du etwas ausführlicher dokumentieren möchtest, kannst du mehrere Zeilen mit /* ... */ umschließen:
/* Dieses Skript schaltet das Licht nur ein, wenn es draußen dunkel ist UND jemand zu Hause ist. */
Warum Kommentare so wichtig sind
Gerade bei selbst geschriebenen Skripten, die man vielleicht Monate später wieder öffnet, helfen dir Kommentare, schnell zu verstehen, was du dir damals dabei gedacht hast.
Außerdem sind sie hilfreich, wenn du deine Skripte mit anderen teilst oder Unterstützung benötigst.
💡 Tipp: Kommentiere am Anfang jeder Datei kurz, was das Skript grundsätzlich macht. Auch vor jeder Funktion oder komplexeren Bedingung ist ein Kommentar sinnvoll.
Variablen und Konstanten – Daten speichern und wiederverwenden
Ein zentrales Konzept in jeder Programmiersprache ist die Möglichkeit, Daten zwischenzuspeichern, zu verändern oder wiederzuverwenden. Dafür gibt es in JavaScript zwei wichtige Schlüsselwörter: let und const.
let – Die veränderbare Variable
Mit let legst du eine Variable an, deren Wert du später ändern kannst. Das ist praktisch, wenn sich der Zustand im Laufe des Skripts ändert – z. B. eine Temperatur oder ein Zähler.
let temperatur = 22; // Aktuelle Temperatur temperatur = 25; // Neuer Wert wird gespeichert
Du kannst let auch verwenden, um Texte (Strings), Wahrheitswerte (Boolean) oder ganze Objekte zu speichern:
let status = "aus"; let lichtAn = false;
const – Die feste Konstante
Mit const legst du einen festen Wert an, der sich nach der ersten Zuweisung nicht mehr ändern darf. Das ist besonders nützlich für Dinge, die sich im Skriptverlauf nicht verändern sollen – z. B. ein fester Schwellwert oder eine URL.
const SCHWELLWERT = 30; // Ab dieser Temperatur soll das Fenster geöffnet werden
💡 Tipp: Schreibweise in Großbuchstaben ist nicht verpflichtend, aber üblich für Konstanten – zur besseren Lesbarkeit.
Was ist mit var?
Vielleicht stößt du in älteren Codebeispielen oder Online-Tutorials auf das Schlüsselwort var. Auch damit lassen sich Variablen anlegen – aber es wird im modernen JavaScript nicht mehr empfohlen, und auch auf dem Shelly solltest du besser let oder const verwenden.
var name = "Wohnzimmer"; // Möglich, aber veraltet
Der Grund: var hat ein verwirrendes Verhalten bei der Gültigkeit von Variablen (sogenanntes „function scope“), während let und const einen klareren „block scope“ nutzen – also nur innerhalb von {} gültig sind.
💡 Empfehlung: Verwende in Shelly-Skripten immer let oder const. Du bist damit auf der sicheren Seite und schreibst sauberen, zukunftssicheren Code.
Was macht print()?
In den folgenden Codebeispielen verwenden wir häufig die Funktion print(). Diese gibt eine Nachricht im Log-Fenster des Webinterfaces aus – dort kannst du genau verfolgen, was dein Skript macht.
print("Hallo Welt!"); // Wird im Log-Fenster angezeigt
Hinweis zu console.log()
Frühere Shelly-Modelle (z. B. Shelly 1 PM Gen2) unterstützten zusätzlich die Funktion console.log(), um Ausgaben direkt in der Browser-Konsole (F12 → Konsole) anzuzeigen.
Mit dem Shelly 1 Gen4 und aktueller Firmware funktioniert console.log() jedoch nicht mehr zuverlässig – Ausgaben erscheinen dort nicht.
👉 Verwende daher ausschließlich print(), wenn du Logausgaben für Debugging oder Statuskontrolle nutzen möchtest.
Bedingungen und Vergleichsoperatoren – Reagiere auf Zustände
In der Automatisierung geht es fast immer darum, auf bestimmte Zustände zu reagieren:
Wenn die Temperatur zu hoch ist, dann aktiviere die Klimaanlage.
Wenn niemand zu Hause ist, dann schalte die Heizung aus.
Genau dafür brauchst du Bedingungen.
In JavaScript – und somit auch bei Shelly-Skripten – nutzt du dazu if, else if und else.
Einfache Bedingung mit if
let temperatur = 28;
if (temperatur > 25) {
print("Es ist zu warm!");
}
Hier prüft das Skript, ob die Temperatur größer als 25 ist. Ist das der Fall, wird die Meldung ausgegeben.
Alternative Wege mit else und else if
let temperatur = 20;
if (temperatur > 25) {
print("Es ist zu warm!");
} else if (temperatur < 18) {
print("Es ist zu kalt!");
} else {
print("Alles im grünen Bereich.");
}
So kannst du verschiedene Fälle abdecken – typisch für Shelly-Projekte, z. B. bei Raumklima, Helligkeit oder Stromverbrauch.
Vergleichsoperatoren
| Operator | Bedeutung | Beispiel |
|---|---|---|
=== | gleich (Wert & Typ) | if (x === 10) |
!== | ungleich | if (x !== 0) |
> | größer als | if (temp > 25) |
< | kleiner als | if (temp < 18) |
>= | größer oder gleich | if (temp >= 20) |
<= | kleiner oder gleich | if (temp <= 22) |
&& | UND-Verknüpfung | if (a > 0 && b < 5) |
💡 Tipp: Verwende === anstelle von ==, um unerwartete Fehler durch automatische Typumwandlung zu vermeiden.
switch–case – Eine klare Alternative zu vielen if-Bedingungen
Wenn du mehrere mögliche Werte einer einzelnen Variable prüfen möchtest, ist ein switch-Statement oft übersichtlicher als viele if–else if-Blöcke. Es eignet sich besonders gut für Zustände, Modi oder Tastenbelegungen, bei denen du auf bestimmte Werte direkt reagieren möchtest.
Aufbau eines switch-Blocks
let modus = "nacht";
switch (modus) {
case "tag":
print("Tagmodus aktiv");
break;
case "nacht":
print("Nachtmodus aktiv");
break;
case "urlaub":
print("Urlaubsmodus aktiv");
break;
default:
print("Unbekannter Modus");
}
Erklärung
- Die Variable
moduswird geprüft. caseprüft auf einen exakten Wert (vergleichbar mit===inif).- Mit
breakbeendest du die Auswertung – andernfalls würden weiterecase-Blöcke auch noch ausgeführt (Stichwort: Fall-Through). - Der
default-Fall wird ausgeführt, wenn kein anderer Fall zutrifft.
Beispiel für Shelly: Reaktion auf eine Taste
let tastenStatus = "lang"; // Wert könnte über ein Event gesetzt werden
switch (tastenStatus) {
case "kurz":
print("Licht ein");
break;
case "lang":
print("Licht aus");
break;
default:
print("Unbekannter Tastendruck");
}
💡 Tipp: Verwende switch, wenn du viele mögliche, eindeutige Zustände prüfen willst – das macht den Code besser lesbar als viele if–Ketten.
Schleifenarten im Vergleich – Kopfgesteuert vs. Fußgesteuert
In JavaScript gibt es verschiedene Arten von Schleifen, die du je nach Situation einsetzen kannst. Besonders wichtig ist der Unterschied zwischen kopfgesteuerten und fußgesteuerten Schleifen.
Kopfgesteuerte Schleifen – erst prüfen, dann ausführen
Kopfgesteuerte Schleifen wie for, while oder forEach prüfen zuerst, ob die Bedingung erfüllt ist. Nur wenn das der Fall ist, wird der Schleifeninhalt ausgeführt.
Beispiel mit while:
let zaehler = 0;
while (zaehler < 3) {
print("Durchlauf " + zaehler);
zaehler++;
}
📌 Vorteil: Die Schleife läuft gar nicht erst los, wenn die Bedingung zu Beginn nicht erfüllt ist.
✅ Ideal, wenn du auf eine Bedingung wie „Sensorwert ist gültig“ oder „Zähler kleiner als X“ achten musst.
Fußgesteuerte Schleifen – erst ausführen, dann prüfen
Die do...while-Schleife ist fußgesteuert. Das bedeutet: Die Schleife wird mindestens einmal ausgeführt, auch wenn die Bedingung gar nicht erfüllt ist.
let zaehler = 5;
do {
print("Durchlauf " + zaehler);
zaehler++;
} while (zaehler < 3);
In diesem Beispiel wird die Schleife trotzdem einmal ausgeführt, obwohl die Bedingung zaehler < 3 gar nicht stimmt.
⚠️ Vorsicht: In sicherheitskritischen Anwendungen (z. B. Schalten von Geräten) solltest du genau überlegen, ob ein einmaliges Ausführen trotz falscher Bedingung wirklich gewünscht ist.
Die for-Schleife – gezielte Wiederholungen mit Zähler
Die for-Schleife ist eine der häufigsten und vielseitigsten Schleifen in JavaScript. Sie ist kopfgesteuert – das heißt, sie prüft vor jedem Durchlauf, ob die Bedingung noch erfüllt ist.
Eine for-Schleife besteht aus drei Teilen:
for (Start; Bedingung; Schritt) {
// Code der wiederholt werden soll
}
Vorwärts zählen
Ein typisches Beispiel: Eine Schleife, die 5 Mal durchläuft und bei 0 beginnt:
for (let i = 0; i < 5; i++) {
print("Durchlauf: " + i);
}
let i = 0: Startwert der Zählvariablei < 5: Solange diese Bedingung erfüllt ist, wird weitergezählti++: Nach jedem Durchlauf wirdium 1 erhöht
📌 Ergebnis: Die Schleife läuft mit i = 0, 1, 2, 3, 4 → insgesamt 5 Durchläufe
Rückwärts zählen
Manchmal möchtest du von einem höheren Wert rückwärts zählen, z. B. bei einem Countdown:
for (let i = 5; i > 0; i--) {
print("Countdown: " + i);
}
let i = 5: Start bei 5i > 0: Solangeigrößer als 0 ist, läuft die Schleifei--:iwird nach jedem Durchlauf um 1 verringert
📌 Ergebnis: Die Schleife läuft mit i = 5, 4, 3, 2, 1
Wann verwende ich eine for-Schleife?
Die for-Schleife eignet sich ideal, wenn du eine feste Anzahl an Wiederholungen durchführen willst oder eine Zählvariable brauchst – z. B. zum:
- Durchzählen von 0 bis X
- Rückwärtszählen (Countdown)
- Wiederholten Ausführen einer Funktion
- Erzeugen von Testausgaben oder Logs
💡 Tipp: Achte darauf, dass die Bedingung auch irgendwann nicht mehr erfüllt ist, sonst läuft die Schleife endlos (Endlosschleife).
Die while-Schleife – Wiederholen solange eine Bedingung gilt
Die while-Schleife ist eine kopfgesteuerte Schleife. Das bedeutet: Bevor der Schleifeninhalt ausgeführt wird, wird geprüft, ob die Bedingung erfüllt ist. Nur dann wird der Code im Inneren ausgeführt.
let zaehler = 0;
while (zaehler < 3) {
print("Durchlauf: " + zaehler);
zaehler++;
}
📌 In diesem Beispiel wird der Code so lange ausgeführt, wie zaehler kleiner als 3 ist. Danach wird die Schleife beendet.
Typischer Einsatzzweck auf dem Shelly:
- Warten auf einen Zustand, z. B. „WLAN verfügbar“
- Wiederholtes Prüfen eines Werts (z. B. Temperatur) bis ein Grenzwert erreicht ist
Wichtig:
Vergiss bei while-Schleifen nie, den Zähler oder die Bedingung irgendwann zu verändern – sonst entsteht eine Endlosschleife.
Die do…while-Schleife – erst ausführen, dann prüfen
Im Gegensatz zur while-Schleife wird bei do...while der Codeblock immer mindestens einmal ausgeführt, auch wenn die Bedingung nicht erfüllt ist. Man spricht deshalb von einer fußgesteuerten Schleife.
let zaehler = 5;
do {
print("Durchlauf: " + zaehler);
zaehler++;
} while (zaehler < 3);
📌 In diesem Beispiel wird die Ausgabe trotz falscher Bedingung einmal gemacht, weil die Prüfung erst nach dem ersten Durchlauf erfolgt.
Typischer Einsatzzweck:
- Wenn du sicher bist, dass eine Aktion immer einmal ausgeführt werden soll (z. B. Initialisierung)
- Bei Menüschleifen oder Wiederholversuchen
Achtung:
Gerade in Shelly-Skripten, wo es um Schalten von Geräten geht, solltest du dir bei do...while genau überlegen, ob ein automatisches „einmaliges Ausführen“ gewünscht ist – z. B. nicht bei sicherheitsrelevanten Aufgaben.
Kurz gesagt:
| Schleife | Typ | Ausführung bei falscher Bedingung | Vorteil |
|---|---|---|---|
while | kopfgesteuert | kein Durchlauf | sicherer bei unklaren Startbedingungen |
do...while | fußgesteuert | mindestens ein Durchlauf | gut für Initialisierungen oder Tests |
Funktionen – Code wiederverwenden und strukturieren
Funktionen sind ein zentrales Konzept in jeder Programmiersprache – auch bei Shelly-Skripten. Sie helfen dir dabei, wiederverwendbare Codeblöcke zu schreiben und den Überblick in komplexeren Skripten zu behalten.
Was ist eine Funktion?
Eine Funktion ist ein benannter Codeblock, den du jederzeit aufrufen kannst. Das spart Wiederholungen und hilft, deinen Code logisch zu strukturieren.
function begruessung() {
print("Willkommen im Smart Home!");
}
begruessung(); // Aufruf der Funktion
💡 Ergebnis: Im Log erscheint die Begrüßung.
Funktionen mit Parametern
Funktionen können Werte übergeben bekommen (Parameter), mit denen sie arbeiten:
function schalte(geraet, status) {
print("Schalte " + geraet + " auf " + status);
}
schalte("Licht", "ein"); // Ausgabe: Schalte Licht auf ein
schalte("Heizung", "aus"); // Ausgabe: Schalte Heizung auf aus
So kannst du eine Funktion für verschiedene Geräte oder Zustände nutzen.
Rückgabewerte mit return
Eine Funktion kann auch etwas zurückgeben, z. B. ein Ergebnis, das du weiterverarbeiten willst:
function addiere(a, b) {
return a + b;
}
let ergebnis = addiere(2, 3);
print(ergebnis); // Ausgabe: 5
Alternative Schreibweise: Arrow-Funktionen
In modernen JavaScript-Versionen (wie sie auch Shelly verwendet) kannst du sogenannte Arrow-Funktionen verwenden. Sie sind kürzer geschrieben, funktionieren aber im Prinzip genauso:
let begruessung = () => {
print("Hallo aus der Arrow-Funktion");
};
begruessung();
Praxisbeispiel: Geräte steuern
function schalteRelais(id, status) {
Shelly.call("Switch.Set", { id: id, on: status });
}
// Lampe einschalten
schalteRelais(0, true);
// Lampe ausschalten
schalteRelais(0, false);
So kannst du das Schalten auf eine einzige Funktion auslagern – das macht dein Skript übersichtlicher und leichter wartbar.
💡 Tipp: Halte deine Funktionen kurz und klar benannt – am besten so, dass man sofort versteht, was sie tun (sendeNachricht(), pruefeWert(), etc.).
Hinweis zu Funktionsnamen
Auch wenn JavaScript grundsätzlich Umlaute und Sonderzeichen in Funktionsnamen erlaubt, solltest du darauf verzichten, insbesondere in Shelly-Skripten:
// Möglich, aber nicht empfohlen
function schalteLichtAn() { ... }
// Besser:
function schalteLichtEin() { ... }
✅ Verwende nur Buchstaben (a–z, A–Z), Zahlen (nicht am Anfang) und den Unterstrich _
🚫 Vermeide Umlaute (ä, ö, ü), Sonderzeichen (ß, &, +, etc.) und Leerzeichen
💡 Tipp: Halte dich an englische Begriffe oder einfache, eindeutige Namen – so bleibt dein Code portabel und verständlich.
Quellen & weiterführende Informationen
Einige Inhalte und Beispiele in diesem Beitrag basieren auf folgenden offiziellen und frei zugänglichen Dokumentationen:
- Shelly Scripting API (Gen2):
Offizielle Dokumentation von Allterco Robotics zur Shelly-Scripting-Umgebung
👉 https://shelly-api-docs.shelly.cloud/gen2/Scripts/Tutorial/ - JavaScript Grundlagen bei W3Schools:
Eine der bekanntesten und einsteigerfreundlichsten Plattformen zum Erlernen von JavaScript
👉 https://www.w3schools.com/js/
1 thought on “Shelly Scripting – JavaScript-Grundlagen für Einsteiger: Variablen, Bedingungen & Logik verstehen”