2026-09-09 14:49:43 +02:00
parent 51f2bfcd4f
commit eb1c205855
8 changed files with 417 additions and 1 deletions
--- a/01_grundlagen/unterricht/tag03/06_variablenbezeichner.html
+++ b/01_grundlagen/unterricht/tag03/06_variablenbezeichner.html
@@ -0,0 +1,67 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Variablenbezeichner</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" />
+  </head>
+  <body>
+    <main>
+      <div class="container py-5">
+        <h1>Variablenbezeichner</h1>
+      </div>
+    </main>
+    <script>
+      'use strict';
+
+      // gültige Variablennamen nach Programmierrichtlinien (nach Airbnb, Google)
+
+      // lowerCamelCase - Schreibweise ohne Sonderzeichen (^[a-zA-Z][0-9]$)
+      const myUrl = 'https://www.gfn.de'; // myURL <- auch in Ordnung
+      const firstName = 'John';
+      const lastName = 'Wick';
+      const parsedUrl = 'gfn.de'; // parsedURL <- auch in Ordnung
+      const question2 = 'Ist das eine korrekte Syntax?';
+      const html = '<h1>Headline</h1>';
+      // const contentHTML = '<h2>In Ordnung</h2>';
+      const contentHtml = '<h1>Headline</h1>';
+
+      // SCREAMING_SNAKE_CASE - Schreibweise bei Konfigurationsvariablen bzw. -konstanten
+      const TAX_RATE = 1.19;
+      const TAX_PERCENTAGE = 19;
+      const API_URL = 'https://api.gfn.de';
+      const SECRET_TOKEN = '123secret';
+
+      // gültige Variablennamen, aber NICHT nach Programmierrichtlinien (Airbnb, Google, MDN)
+      let $zahl = 2;
+      let _myVar = 'Wert';
+      let __self = this;
+      let counter_rounds = 100;
+
+      // syntaktisch korrekte Schreibweise, aber unschön (BITTE VERMEIDEN)
+      let zähler = 12;
+      let éviter = 'vermeiden';
+      let straße = 'Musterstr. 1';
+
+      let ᓚᘏᗢ = 'cat';
+      let 串 = 'test';
+      let المعرف = 'ja geht';
+
+      console.log(Math.PI); //=> 3.141592653589793
+      console.log(Math.pow(4, 2)); //=> 4 ** 2 => 16
+
+      // let Math = 'test';
+      // console.log(Math.pow(4, 2)); //=> 4 ** 2 => 16
+
+      // ungültige Variablen
+      // let let = 'nope'; // statements bzw. Schlüsselwörter können nicht überschrieben werden
+      // let for = 'me';
+      // let typeof = 'file';
+      // let 🚀 = 'rocket';
+      // let 2ndCountet = 2; // Ziffern nicht am Anfang
+      // let prozent% = '100'
+      // let counter-values = [1,20, 40]
+    </script>
+  </body>
+</html>
--- a/01_grundlagen/unterricht/tag03/07_verkettungsoperator.html
+++ b/01_grundlagen/unterricht/tag03/07_verkettungsoperator.html
@@ -0,0 +1,52 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Verkettungsoperator oder Konkatenationsoperator (+)</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" />
+  </head>
+  <body>
+    <main>
+      <div class="container py-5">
+        <h1>Verkettungsoperator oder Konkatenationsoperator (+)</h1>
+        <div class="output alert alert-secondary my-3"></div>
+      </div>
+    </main>
+    <script>
+      'use strict';
+
+      const outputEl = document.querySelector('.output');
+
+      const username = 'Ladislaus';
+      const firstName = 'John';
+      const lastName = 'Wick';
+      const currentAge = 38;
+
+      console.log('Hi ' + 'Oswine' + '. Welcome to NerdWorld!');
+      // => Hi Oswine. Welcome to NerdWorld!
+
+      console.log('Hi ' + username + '. Welcome to NerdWorld!');
+      // => Hi Ladislaus. Welcome to NerdWorld!
+
+      // ES6 (2015) - Template Literal (EMPFEHLUNG)
+      console.log(`Hi ${username}. Welcome to NerdWorld!`);
+
+      console.log(
+        'Hi ' +
+          firstName +
+          ' ' +
+          lastName +
+          ".\nHow's your dog? In 10 years from now you will be " +
+          (currentAge + 10) +
+          ' years old.',
+      );
+
+      const text = `Hi ${firstName} ${lastName}.\nHow's your dog? In 10 years from now you will be ${currentAge + 10} years old.`;
+
+      console.log(text);
+
+      outputEl.innerHTML = text.replaceAll('\n', '<br />'); // nl2br() in php
+    </script>
+  </body>
+</html>