ptorrel/JS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Browse Source
This commit is contained in:
Philippe Torrel
2026-06-26 10:32:59 +02:00
parent 878c0f7c6b
commit 0e70223ff6
11 changed files with 93 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
01_grundlagen/agenda.md
View File

@@ -155,6 +155,7 @@ theme: default
- Array.find und Array.findIndex - Array.find und Array.findIndex
- Alle Array Higher Order Funktionen im Überblick - Alle Array Higher Order Funktionen im Überblick
- local scoping
- **Exkurs: Schleifen** - **Exkurs: Schleifen**
**Übungen:** **Übungen:**

19
01_grundlagen/uebungen/#u39_sort-stadt-land-fluss.html → 01_grundlagen/uebungen/u39_sort-stadt-land-fluss.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -41,13 +41,26 @@
const outputElC = document.querySelector('.outputC'); const outputElC = document.querySelector('.outputC');
// Variablen // Variablen
const cities = ['Barcelona', 'Basel', 'Belgrade', 'Berlin', 'Budapest']; const cities = ['Barcelona', 'Basel', 'Belgrade', 'Berlin', 'Budapest'];
const countries = ['Belgium', 'Bulgaria', 'Brazil', 'Bolivia', 'Bosnia and Herzegovina']; const countries = ['Belgium', 'Bulgaria', 'Brazil', 'Bolivia', 'Bosnia and Herzegovina'];
const rivers = ['Bode', 'Brahmaputra', 'Beuvron', 'Black River', 'Belaja']; const rivers = ['Bode', 'Brahmaputra', 'Beuvron', 'Black River', 'Belaja'];
// Sortieren nach Länge // Funktionen
const sortByLength = (ar = []) => {
return ar.sort((a, b) => b.length - a.length);
};
// TODO: do it // Sortieren nach Länge
const sortedCities = sortByLength(cities); //cities.sort((a, b) => b.length - a.length);
const sortedCountries = sortByLength(countries); // countries.sort((a, b) => b.length - a.length);
const sortedRivers = sortByLength(rivers); // rivers.sort((a, b) => b.length - a.length);
console.log(sortByLength());
console.log(sortedCities);
console.log(sortedCountries);
console.log(sortedRivers);
</script> </script>
</body> </body>
</html> </html>

11
01_grundlagen/uebungen/#u40_map-lueckentext.html → 01_grundlagen/uebungen/u40_map-lueckentext.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -24,13 +24,16 @@
let inputs = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; let inputs = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
//double //double
results = inputs.map(); results = inputs.map((num) => num * 2);
console.log(results); // => [2, 4, 6, 8, 10, 12, 14, 16, 18, 20] console.log(results); // => [2, 4, 6, 8, 10, 12, 14, 16, 18, 20]
//squares //squares
results = inputs.map(); results = inputs.map((num) => num * num);
results = inputs.map((num) => num ** 2);
results = inputs.map((num) => Math.pos(num, 2));
// => [1, 4, 9, 16, 25, 36, 49, 64, 81, 100]
console.log(results);
console.log(results); // => [1, 4, 9, 16, 25, 36, 49, 64, 81, 100]
// //
</script> </script>
</body> </body>

7
01_grundlagen/uebungen/#u41_tranformierte-ladislaus.html → 01_grundlagen/uebungen/u41_tranformierte-ladislaus.html
View File

@@ -61,7 +61,7 @@
</form> </form>
<div class="alert alert-secondary"> <div class="alert alert-secondary">
<h3 class="mt-2">Transformierter Name:</h3> <h5 class="mt-2">Transformierter Name:</h5>
<div class="output"></div> <div class="output"></div>
</div> </div>
</div> </div>
@@ -76,8 +76,9 @@
const outputEl = document.querySelector('.output'); const outputEl = document.querySelector('.output');
// Übung 03 // Übung 03
const transformName = (firstNames = [], lastName) => { const transformName = (firstNames = [], lastName = '') => {
/* TODO: do it */ const initials = firstNames.map((name) => `${name[0].toUpperCase()}.`);
return `${initials.join(' ')} ${lastName}`;
}; };
formTransformEl.addEventListener('submit', (e) => { formTransformEl.addEventListener('submit', (e) => {

12
01_grundlagen/uebungen/#u42_filter-boardgames.html → 01_grundlagen/uebungen/u42_filter-boardgames.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -42,11 +42,13 @@
'Fearsome Floors', 'Fearsome Floors',
]; ];
const boardgamesStartingWithF = boardgames.filter((name) => { const getBoardgamesStartingWithF = () => {
/* TODO: do it */ return boardgames.filter((name) => {
return name.toLowerCase().startsWith('f');
}); });
};
console.log(boardgamesStartingWithF); //=> ['Funny Friends', 'Fauna', 'Fairy Tale', 'Fast Flowing Forest Fellers', 'Fearsome Floors'] outputEl.textContent = getBoardgamesStartingWithF().join(' --- ');
console.log(getBoardgamesStartingWithF()); //=> ['Funny Friends', 'Fauna', 'Fairy Tale', 'Fast Flowing Forest Fellers', 'Fearsome Floors']
</script> </script>
</body> </body>
</html> </html>

16
01_grundlagen/uebungen/#u43_filter-results.html → 01_grundlagen/uebungen/u43_filter-results.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -32,21 +32,27 @@
//1. even numbers //1. even numbers
results = inputs.filter(); results = inputs.filter((input) => input % 2 === 0);
console.log(results); // => [2, 4, 6, 8, 10] console.log(results); // => [2, 4, 6, 8, 10]
//2. names ending with letter 'e' or 'a' //2. names ending with letter 'e' or 'a'
results = names.filter(); results = names.filter((name) => {
return name.endsWith('a') || name.endsWith('e');
});
console.log(results); // => [ 'Friedlinde', 'Tusnelda', console.log(results); // => [ 'Friedlinde', 'Tusnelda',
//3. words with at least three letters //3. words with at least three letters
const wordAr = text.split(' '); const wordAr = text.split(' '); // => ['Hi', 'this', 'is', 'a', 'short', 'text'];
result = wordAr.filter(); result = wordAr
.filter((text) => {
return text.length >= 3;
})
.join(' ');
console.log(result); // => 'this short text' console.log(result); // => 'this short text'
</script> </script>

22
01_grundlagen/uebungen/#u44_quersumme.html → 01_grundlagen/uebungen/u44_quersumme.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -16,19 +16,37 @@
<strong>Hinweis:</strong> Die Quersumme ist die Summe aller Ziffern einer Zahl. <br /><strong>Tipp:</strong> <strong>Hinweis:</strong> Die Quersumme ist die Summe aller Ziffern einer Zahl. <br /><strong>Tipp:</strong>
Verwenden Sie split(''). Verwenden Sie split('').
</p> </p>
<div class="output alert alert-secondary my-3"></div>
</div> </div>
</div> </div>
</main> </main>
<script> <script>
'use strict'; 'use strict';
const outputEl = document.querySelector('.output');
const number = 4566; const number = 4566;
const getDigitSum = (n) => {}; const getDigitSum = (n) => {
// n in ein array umwandeln
const digitAr = String(n).split(''); // (n).toString().split('')
// => z.B. ['4','2','4','2']
// Die quersumme berechnen und zurückgeben
return digitAr.reduce((digit1, digit2) => Number(digit1) + Number(digit2), 0);
};
const getDigitSum1 = (n) => {
return String(n) // => '4242'
.split('') // => ['4','2','4','2']
.map((str) => Number(str)) // => .map(Number) [4,2,4,2]
.reduce((sum, n) => sum + n, 0); //=> 12
};
console.log(getDigitSum(4242)); //=> 12 console.log(getDigitSum(4242)); //=> 12
console.log(getDigitSum('13')); //=> 4 console.log(getDigitSum('13')); //=> 4
console.log(getDigitSum(134)); //=> 8
outputEl.textContent = `Die Quersumme von ${number} ist: ${getDigitSum(number)}!`;
//======== //========
</script> </script>
</body> </body>

26
01_grundlagen/uebungen/#u45_quersummen-sortiert.html → 01_grundlagen/uebungen/u45_quersummen-sortiert.html
View File

@@ -17,19 +17,39 @@
sortieren. sortieren.
</p> </p>
</div> </div>
<div class="output alert alert-secondary my-3"></div>
</div> </div>
</main> </main>
<script> <script>
'use strict'; 'use strict';
const outputEl = document.querySelector('.output');
const numbers = [99, 5, 8, 12, 111, 123]; const numbers = [99, 5, 8, 12, 111, 123];
const getDigitSum = (n) => {}; // const getDigitSum = (n) => {
// return String(n) // => '4242'
// .split('') // => ['4','2','4','2']
// .map((str) => Number(str)) // => .map(Number) [4,2,4,2]
// .reduce((sum, n) => sum + n, 0); //=> 12
// };
const getDigitSum = (n) => {
// n in ein array umwandeln
const digitAr = String(n).split('');
// Die quersumme berechnen und zurückgeben
const result = digitAr.reduce((digit1, digit2) => {
return Number(digit1) + Number(digit2);
}, 0);
return result;
};
const getSortedArrayByDigitSum = (numbers) => {}; const getSortedArrayByDigitSum = (numbers = []) => {
return [...numbers].sort((a, b) => getDigitSum(a) - getDigitSum(b));
};
outputEl.textContent = getSortedArrayByDigitSum(numbers);
console.log(getSortedArrayByDigitSum([4, 12])); //=> [12, 4] console.log(getSortedArrayByDigitSum([4, 12])); //=> [12, 4]
console.log(getSortedArrayByDigitSum(numbers)); //=> [12, 111, 5, 123, 8, 99] console.log(getSortedArrayByDigitSum(numbers)); //=> [12, 111, 5, 123, 8, 99]
console.log(numbers); console.log(numbers);

2
01_grundlagen/unterricht/tag09/02_ar-reverse.html
View File

@@ -40,6 +40,8 @@
// Array Methode - ar.reverse() // Array Methode - ar.reverse()
console.log(names[0].split('').reverse().join('')); //=> nisrE
const namesCopy = [...names]; const namesCopy = [...names];
const namesReversed = namesCopy.reverse(); const namesReversed = namesCopy.reverse();

1
01_grundlagen/unterricht/tag09/04_ar-sort-compare-fn.html
View File

@@ -45,7 +45,6 @@
const lottoNumbers = [16, 10, 2, 12, 1, 33]; const lottoNumbers = [16, 10, 2, 12, 1, 33];
// Array Methode - ar.sort(compareFn) // Array Methode - ar.sort(compareFn)
console.log([...lottoNumbers].sort()); // => [16, 10, 2, 12, 1, 33] console.log([...lottoNumbers].sort()); // => [16, 10, 2, 12, 1, 33]
const numericSorted = [...lottoNumbers].sort((a, b) => { const numericSorted = [...lottoNumbers].sort((a, b) => {

1
01_grundlagen/unterricht/tag09/11_ar-every.html
View File

@@ -72,6 +72,7 @@
console.log(isForEveryone()); // => false console.log(isForEveryone()); // => false
// Sonderfall
console.log([].every(() => false)); //=> true; console.log([].every(() => false)); //=> true;
// Optionale Parameter von Some =================== // Optionale Parameter von Some ===================