2026-07-01 11:14:39 +02:00
parent 2dbadb9c4f
commit faccb4ef34
4 changed files with 100 additions and 30 deletions
--- a/02_advanced/uebungen/u02_distance/index.html
+++ b/02_advanced/uebungen/u02_distance/index.html
@@ -0,0 +1,41 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Übung 2: Ist es noch weit? Sind wir schon da?</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-primary">
+          <h2>Übung 2: Ist es noch weit? Sind wir schon da?</h2>
+          <p>Die Formel zur Berechnung von Entfernungen lautet:</p>
+          <code>
+            <pre>Math.sqrt((yDestination - yOrigin) ** 2 + (xDestination - xOrigin) ** 2);</pre>
+          </code>
+          <p>Schreibe eine Funktion distance, die du z. B. folgendermaßen aufrufen kannst:</p>
+          <code>
+            <pre>distance({ x: 1, y: 1 }, { x: 5, y: 1 }); // => 4</pre>
+          </code>
+        </div>
+      </div>
+    </main>
+    <script>
+      'use strict';
+
+      const distance = ({ x: xOrigin, y: yOrigin }, { x: xDest, y: yDest }) => {
+        return Math.sqrt((yDest - yOrigin) ** 2 + (xDest - xOrigin) ** 2);
+      };
+
+      // RECOMMENDED without destructuring
+      const getDistance = (origin, dest) => {
+        return Math.sqrt((dest.y - origin.y) ** 2 + (dest.x - origin.x) ** 2);
+      };
+
+      console.log('Die Distanz beträgt: ', distance({ x: 1, y: 1 }, { x: 5, y: 1 }));
+      console.log('Die Distanz beträgt: ', getDistance({ x: 1, y: 1 }, { x: 5, y: 1 }));
+    </script>
+  </body>
+</html>