feat: webseite-js

2026-07-03 13:07:49 +02:00
parent 9a1be89bd8
commit ddaae120a7
14 changed files with 1490 additions and 36 deletions
--- a/02_advanced/uebungen/u09_level-rekursiv/index.html
+++ b/02_advanced/uebungen/u09_level-rekursiv/index.html
@@ -0,0 +1,148 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Übung 9: Tiefste Ebene eines verschachtelten Arrays finden</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">
+        <div class="alert alert-warning">
+          <h2>Übung 9 (advanced): Tiefste Ebene eines verschachtelten Arrays finden</h2>
+          <p>
+            Schreibe eine rekursive Funktion in JavaScript, die die tiefste Ebene eines verschachtelten Arrays bestimmt.
+            Die Funktion soll die maximale Verschachtelungstiefe des Arrays zurückgeben.
+          </p>
+        </div>
+      </div>
+    </main>
+    <script>
+      'use strict';
+
+      const findDeepestLevel = (arr, currentLevel = 1) => {
+        if (arr.length === 0) {
+          return currentLevel;
+        }
+
+        let maxLevel = currentLevel;
+
+        // Array durchlaufen
+        for (let i = 0; i < arr.length; i++) {
+          // wenn element array
+          if (Array.isArray(arr[i])) {
+            /* currentlevel um eins erhöhen und rekursiv wieder aufrufen und neue tiefe ermitteln. Wenn der letzte Aufruf von findD... abgeschlossen wird, wird die dort ermittelte Tiefe zurückgegeben usw...*/
+            const depth = findDeepestLevel(arr[i], currentLevel + 1);
+            // wenn tiefe höher als momentan max Tiefe, neue tiefe setzen
+            if (depth > maxLevel) {
+              maxLevel = depth;
+            }
+          }
+        }
+
+        // neue tiefe zurückgeben
+        return maxLevel;
+      };
+      const findDeepestLevel2 = (arr, currentLevel = 1) => {
+        if (arr.length === 0) {
+          return currentLevel;
+        }
+
+        let maxLevel = currentLevel;
+
+        // Array durchlaufen
+        arr.forEach((item) => {
+          if (Array.isArray(item)) {
+            const depth = findDeepestLevel2(item, ++currentLevel); // Rekursion
+            if (depth > maxLevel) {
+              maxLevel = depth;
+            }
+          }
+        });
+
+        // neue tiefe zurückgeben
+        return maxLevel;
+      };
+
+      const numbers = [
+        1, //
+        [
+          2, //
+          [3],
+        ],
+        [1],
+      ];
+
+      console.log(numbers[0]); // => 1
+      console.log(numbers[2]); // => [1]
+      console.log(numbers[2][0]); // => 1
+
+      const data = [
+        'wert', //
+        [
+          'wert', //
+          'wert',
+          'wert',
+          [
+            'wert', //
+            'wert',
+            [
+              'wert', //
+              'wert',
+              ['wert'],
+            ],
+          ],
+        ],
+      ];
+
+      console.log(findDeepestLevel(data)); // => 5
+      console.log(findDeepestLevel2(data)); // => 5
+      console.log(findDeepestLevel([1, [2, [3]], [1]])); // => 3
+
+      // const findDeepestLevelIte = (arr) => {
+      //   if (arr.length === 0) {
+      //     return 1;
+      //   }
+
+      //   console.log('Länge des Arrays: ', arr.length);
+
+      //   let depth = 0;
+      //   for (let i = 0; i < arr.length; i++) {
+      //     // console.log('i: ', i, ' arr.length: ', arr.length);
+      //     if (Array.isArray(arr[i])) {
+      //       depth++;
+      //       console.log('depth wird erhöht: ', depth);
+      //     } else {
+      //       console.log('kein Array');
+      //     }
+      //   }
+
+      //   return depth;
+      // };
+
+      // Test cases
+      console.log(findDeepestLevel([1, [2, [3]], [1]])); // => 3
+      console.log(findDeepestLevel([1, [2, [3, [4]], 5]])); // => 4
+      console.log(findDeepestLevel([1, 2, 3, 4, 5])); // => 1
+      // console.log(findDeepestLevel([])); // => 1
+      // console.log(findDeepestLevel([1, [2], [3, [4, [5]]]])); // => 4
+      // console.log(findDeepestLevel([1, [2, [3]], [4, [5, [6]]]])); // => 4
+
+      // const $on = (el, ev, fn) => {
+      //   Array.isArray(el) ? el.forEach((ae) => $on(ae, ev, fn)) : el.addEventListener(ev, fn);
+      //   return el;
+      // };
+
+      // $on(Array.from(document.querySelectorAll('li')), 'click', (e) => {
+      //   console.log('click');
+      // });
+
+      // Array.from(document.querySelectorAll('li')).forEach((el) => {
+      //   el.addEventListener('click', (e) => {
+      //     console.log('click');
+      //   });
+      // });
+    </script>
+  </body>
+</html>