01_grundlagen/uebungen/u46_richtige-gewinner.html

@@ -34,11 +34,15 @@
       'use strict';
 
       const outputEl = document.querySelector('.output');
-
       const winners = ['Heribert', 'Friedlinde', 'Tusnelda', 'Oswine', 'Ladislaus'];
+      const labels = ['1st', '2nd', '3rd'];
 
       // Beispiel
-      const getWinners = (winners) => {};
+      const getWinners = (winners) => {
+        return winners.map((winner, index) => {
+          return index < labels.length ? `${labels[index]} place: ${winner}` : winner;
+        });
+      };
 
       console.log(getWinners(winners));
       outputEl.innerHTML = `<ul><li>${getWinners(winners).join('</li><li>')}</li></ul>`;

01_grundlagen/uebungen/u47_higher-order-fn-lueckentext.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="de">
   <head>
     <meta charset="UTF-8" />
@@ -26,54 +26,109 @@
       let names = ['Heribert', 'Friedlinde', 'Tusnelda', 'Oswine', 'Ladislaus'];
 
       //odd numbers
-      //results = inputs
+      let resultsOddNumber = inputs.filter((n) => {
-      console.log(results); // => [ 1, 3, 5, 7, 9 ]
+        if (n % 2 !== 0) {
+          return true;
+        }
+      });
+
+      // resultsOddNumber = inputs.filter((n) => n % 2 !== 0);
+
+      console.log(resultsOddNumber); // => [ 1, 3, 5, 7, 9 ]
 
       //sum
-      //result = inputs
+      let resultSum = inputs.reduce((sum, n) => {
-      console.log(result); // => 55
+        return sum + Number(n);
+      }, 0);
+
+      // resultSum = inputs.reduce((sum, n) => sum + Number(n), 0);
+      console.log(resultSum); // => 55
 
       //product
-      //result = inputs
+      let resultProduct = inputs.reduce((sum, n) => {
-      console.log(result); // => 3628800
+        return sum * Number(n);
+      }, 1);
+
+      // resultProduct = inputs.reduce((sum, n) => sum * Number(n), 1);
+      console.log(resultProduct); // => 3628800
 
       //longest word length
-      result = text.split(' '); //=> ['Hi', 'this', 'is', 'a', 'short', 'text'];
+
-      //
+      // ['Hi', 'this', 'is', 'a', 'short', 'text'];
+
+      result = text.split(' ').reduce((length, str) => {
+        return str.length > length ? str.length : length;
+      }, 0);
+
+      result = text
+        .split(' ') // ['Hi', 'this', 'is', 'a', 'short', 'text'];
+        .map((word) => word.length) // [2, 4, 2, 1, 5, 4];
+        .reduce((longest, word) => Math.max(longest, word), 0);
+      // => ['Hi', 'this', 'is', 'a', 'short', 'text'];
 
       console.log(result); // => 5
 
       //longest word
-      result = text.split(' '); //=> ['Hi', 'this', 'is', 'a', 'short', 'text'];
+      result = text.split(' ').filter((str) => str.length === result)[0];
-      //
 
+      result = text.split(' ').reduce((res, word) => {
+        return res.length > word.length ? res : word;
+      }, '');
+      //=> ['Hi', 'this', 'is', 'a', 'short', 'text'];
       console.log(result); // =>'short'
 
       //avg word length =========================
 
-      // result =
+      // [0 , 'Hi', 'this', 'is', 'a', 'short', 'text'];
+      result = text.split(' ').reduce((sum, str, idx, arr) => {
+        const sumStrLength = sum + str.length;
+        let returnValue = 0;
+
+        return idx === arr.length - 1 ? sumStrLength / arr.length : sumStrLength;
+      }, 0);
+
+      result =
+        text
+          .split(' ') // => ['Hi', 'this', 'is', 'a', 'short', 'text'];
+          .map((x) => x.length) // => [2, 4, 2, 1, 5, 4];
+          .reduce((sum, x) => sum + x, 0) / text.split(' ').length;
+
+      result = text.replaceAll(' ', '').length / text.split(' ').length;
+
       console.log(result); // => 3
 
       //sort by 3rd letter
       // ['Heribert', 'Friedlinde', 'Tusnelda', 'Oswine', 'Ladislaus'];
 
       const names2 = [...names];
-      // results =
+      results = names2.sort((a, b) => (a.charAt(2) > b.charAt(2) ? 1 : -1));
+
       console.log(results); // => [ 'Ladislaus', 'Friedlinde', 'Heribert', 'Tusnelda', 'Oswine' ]
 
       // Are there names with more than 8 letters?
       // ['Heribert', 'Friedlinde', 'Tusnelda', 'Oswine', 'Ladislaus'];
 
-      // result = names
+      result = names.some((name) => {
+        return name.length > 8;
+      });
+      console.log(result); // => true
 
       // Has every name at least 8 letters?
-      // result = names
+      result = names.every((name) => {
+        return name.length >= 8;
+      });
       console.log(result); // false
 
       // What is the lowest value from the inputs?
       // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
-      // result = inputs
+      result = inputs.sort((a, b) => a - b).at(0);
-      console.log(result);
+      // result = inputs.sort((a, b) => a - b)[0];
+
+      result = inputs.reduce((n1, n2) => (n1 < n2 ? n1 : n2));
+
+      result = Math.min(...inputs);
+
+      console.log(result); // => 1;
     </script>
   </body>
 </html>

01_grundlagen/uebungen/u48_froehliches-mixen.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="de">
   <head>
     <meta charset="UTF-8" />
@@ -28,7 +28,13 @@
     <script>
       'use strict';
 
-      const honoluluFlip = ['Maracuja Juice', 'Pineapple Juice', 'Lemon Juice', 'Grapefruit Juice', 'Crushed Ice'];
+      const honoluluFlip = [
+        'Maracuja Juice', //
+        'Pineapple Juice',
+        'Lemon Juice',
+        'Grapefruit Juice',
+        'Crushed Ice',
+      ];
 
       const ingredientsFromMyBar = [
         'Pineapple',
@@ -49,17 +55,16 @@
 
       // 1. Schreibe eine Funktion, `hasIngredient`, die `true` zurückgibt, wenn eine angegebene Zutat in einer Rezeptliste vorhanden ist. Rufe deine Funktion mit Maracujsasaft und Honolulu Flip auf.
 
-      const hasIngredient = (listOfIngredients, searchedIngredient) => {
+      const hasIngredient = (listOfIngredients, searchedIngredient) => listOfIngredients.includes(searchedIngredient);
-        /* ??? */
+
-      };
+      console.log(hasIngredient(honoluluFlip, 'Maracuja Juice')); // => true
 
       // 2. So richtig sinnvoll ist unsere Funktion noch nicht. Viel hilfreicher wäre es, wenn wir eine Funktion hätten, die anhand unserer vorhandenen Zutaten herausfindet, ob wir den Cocktail auch tatsächlich machen können. Dafür benötigst du die komplette Liste aller bei dir vorhandenen Zutaten (ingredientsFromMyBar). Du möchtest wissen, ob du alle Zutaten vorrätig hast, die du zum Mixen des Cocktails benötigst.
 
-      const isMixableWith = (cocktailRecipe, availableIngredients) => {
+      const isMixableWith = (cocktailRecipe, availableIngredients) =>
-        /* ??? */
+        cocktailRecipe.every((ingredient) => hasIngredient(availableIngredients, ingredient));
-      };
 
-      //honoluluFlip isMixableWith ingredientsFromMyBar?
+      // honoluluFlip isMixableWith ingredientsFromMyBar?
       console.log(isMixableWith(honoluluFlip, ingredientsFromMyBar)); // => true
     </script>
   </body>

01_grundlagen/unterricht/tag10/09_local-scoping-iife.html

@@ -67,7 +67,10 @@
     <script>
       'use strict';
       // Einschränkung vom Gültigkeitsbereich mit IIFE (() => {})()
-      (() => {
+      ((jq) => {
+        const $ = (qs) => document.querySelector(qs);
+        const $$ = (qs) => Array.from(document.querySelectorAll(qs));
+
         var numbers = [1, 2, 3, 4, 5];
         let userRoles = ['admin', 'guest', 'editor'];
         let name = 'User Dashboard';
@@ -81,8 +84,9 @@
         });
         // code logic....
 
-        $('.container').css({ backgroundColor: '#eee' });
+        jq('.container').css({ backgroundColor: '#eee' });
-      })();
+        jq('h1').animate({ marginTop: '200px' }, 800);
+      })($);
 
       console.log(numbers); //=> ReferenceError: numbers is not defined
       console.log(slider); //=> ReferenceError: slider is not defined

01_grundlagen/unterricht/tag10/10_prefer-const.html

@@ -16,7 +16,7 @@
       'use strict';
 
       // prefer-const
-      let transform = (fullName) => {
+      const transform = (fullName) => {
         const nameParts = fullName.split(' '); // =>  ['Ladislaus', 'Coolio', 'Barry', 'Crazy', 'Jones'];
         const lastName = nameParts.slice(nameParts.length - 1); // => 'Jones'
 
@@ -28,6 +28,8 @@
         return firstNames.map((firstName) => firstName.charAt(0) + '.').join(' ') + ' ' + lastName;
       };
 
+      // const transfrom = 'Optimus'
+
       console.log(transform(aLongName));
       // transform = 'text'; // Uncaught TypeError: Assignment to constant variable