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-07-06 14:25:41 +02:00
parent 549233f42a
commit ee4d6f0d41
226 changed files with 114478 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
02_advanced/uebungen/u14_avg-scores/index.html Normal file
View File

@@ -0,0 +1,39 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Übung 14: Durchschnittsnoten berechnen</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 14: Durchschnittsnoten berechnen</h2>
<p>
Schreibe eine Funktion <code>calculateAverageGrades</code>, die die Durchschnittsnote jedes Schülers (ohne
den Namen) berechnet und als neues Array zurückgibt.
</p>
<p>
Die Funktion <code>calculateAverageGrades</code> soll die Durchschnittsnoten jedes Schülers berechnen, indem
sie die Noten in den Fächern zusammenzählt und durch die Anzahl der Fächer teilt. Runde die
Durchschnittswerte auf zwei Dezimalstellen.
</p>
</div>
</div>
</main>
<script>
'use strict';
const gradesTable = [
['Name', 'Mathematics', 'English', 'Biology', 'History'],
['Anna', 85, 92, 78, 88],
['Ben', 90, 88, 84, 79],
['Clara', 76, 95, 89, 91],
['David', 82, 79, 91, 85],
];
</script>
</body>
</html>

38
02_advanced/uebungen/u15_shopping-list/index.html Normal file
View File

@@ -0,0 +1,38 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Übung 15: Einkaufsliste bearbeiten</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 15: Einkaufsliste bearbeiten</h2>
<p>
Erstelle eine Einkaufsliste als zweidimensionales Array mit Kategorien und Artikeln. Führe folgende
Änderungen durch:
</p>
<ol class="list">
<li>Entferne das zweite Element aus jeder Kategorie.</li>
<li>Füge jeweils ein neues Element hinzu.</li>
</ol>
</div>
</div>
</main>
<script>
'use strict';
const shoppingList = [
['Fruits', 'Apples', 'Bananas', 'Oranges'],
['Vegetables', 'Carrots', 'Broccoli', 'Spinach'],
['Dairy', 'Milk', 'Cheese', 'Yogurt'],
];
// Your code here
</script>
</body>
</html>

42
02_advanced/uebungen/u16_geoquiz/index.html Normal file
View File

@@ -0,0 +1,42 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Übung 16: Geoquiz</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 16: Geoquiz</h2>
<p>
Eine Schule gibt die Entwicklung eines Geoquiz in Auftrag, bei dem Schüler die Hauptstädte verschiedener
Staaten nennen müssen. Deine Aufgabe besteht in der Entwicklung der Lösungsfunktion
<code>getCapitalOf</code>, die eine Hauptstadt zum übergebenen Staat (<code>country</code>) zurückliefert.
</p>
<ol class="list">
<li>Entferne das zweite Element aus jeder Kategorie.</li>
<li>Füge jeweils ein neues Element hinzu.</li>
</ol>
</div>
</div>
</main>
<script>
'use strict';
const countriesWithCapital = [
['UK', 'London'],
['France', 'Paris'],
['Germany', 'Berlin'],
['Switzerland', 'Bern'],
['Austria', 'Vienna'],
['Russia', 'Moscow'],
];
const getCapitalOf = () => {};
</script>
</body>
</html>

69
02_advanced/uebungen/u17_inventory-modification/index.html Normal file
View File

@@ -0,0 +1,69 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Übung 17: Lagerbestand erweitern</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 17: Lagerbestand erweitern</h2>
<p>
Füge eine neue Kategorie <strong>«Books»</strong> zu dem bestehenden dreidimensionalen Lagerbestandssystem
hinzu und trage zwei neue Produkte mit deren Lagerorten und Mengen ein.
</p>
</div>
</div>
</main>
<script>
'use strict';
const inventory = [
[
// Category: Electronics
['Shelf 1', 'Laptop', 10],
['Shelf 2', 'Smartphone', 25],
],
[
// Category: Clothing
['Shelf 1', 'T-Shirts', 50],
['Shelf 2', 'Jeans', 30],
],
[
// Category: Groceries
['Shelf 1', 'Milk', 100],
['Shelf 2', 'Bread', 80],
],
];
// Your code here
console.log(inventory);
/* Expected outcome:
[
[ // Electronics
['Shelf 1', 'Laptop', 10],
['Shelf 2', 'Smartphone', 25],
],
[ // Clothing
['Shelf 1', 'T-Shirts', 50],
['Shelf 2', 'Jeans', 30],
],
[ // Groceries
['Shelf 1', 'Milk', 100],
['Shelf 2', 'Bread', 80],
],
[ // Books
['Shelf 1', 'Novels', 40],
['Shelf 2', 'Non-fiction', 35],
],
]
*/
// Your code here
</script>
</body>
</html>

66
02_advanced/uebungen/u18_3d-array-selection/index.html Normal file
View File

@@ -0,0 +1,66 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Übung 18: 3D Array Zugriff</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 18: 3D Array Zugriff</h2>
<p>
Greife auf das zweite Produkt in der <strong>«Clothing»</strong>-Kategorie zu und ändere die Menge von
<strong>«Jeans»</strong> von 30 auf 25.
</p>
</div>
</div>
</main>
<script>
'use strict';
const inventory = [
[
// Category: Electronics
['Shelf 1', 'Laptop', 10],
['Shelf 2', 'Smartphone', 25],
],
[
// Category: Clothing
['Shelf 1', 'T-Shirts', 50],
['Shelf 2', 'Jeans', 30],
],
[
// Category: Groceries
['Shelf 1', 'Milk', 100],
['Shelf 2', 'Bread', 80],
],
[
// Category: Books
['Shelf 1', 'Novels', 40],
['Shelf 2', 'Non-fiction', 35],
],
];
// Your code here
console.log(inventory);
/*
Expected outcome:
[
[ // Electronics
['Shelf 1', 'Laptop', 10],
['Shelf 2', 'Smartphone', 25],
],
[ // Clothing
['Shelf 1', 'T-Shirts', 50],
['Shelf 2', 'Jeans', 25], // Changed quantity
],
// ...
]
*/
</script>
</body>
</html>

64
02_advanced/uebungen/u19_brightness-increase/index.html Normal file
View File

@@ -0,0 +1,64 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Übung 19: Bildbearbeitung – Helligkeit erhöhen</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 19: Bildbearbeitung – Helligkeit erhöhen</h2>
<p>
Schreibe eine Funktion <code>increaseBrightness</code>, die die Helligkeit aller Pixel in einem 3D Bildarray
um einen bestimmten Wert erhöht. Stelle sicher, dass die RGB-Werte nicht über <code>255</code> hinausgehen.
</p>
<p>
Die Funktion nimmt ein dreidimensionales Array <code>image</code> und einen Wert <code>value</code> als
Parameter. Ziel ist es, die Helligkeit jedes Pixels im Bild zu erhöhen, indem jeder RGB-Wert um
<code>value</code> erhöht wird. Stelle dabe sicher, dass kein RGB-Wert den maximalen Wert von
<code>255</code> überschreitet.
</p>
</div>
</div>
</main>
<script>
'use strict';
const image = [
[
// Row 1
[100, 150, 200], // Pixel 1
[50, 100, 150], // Pixel 2
],
[
// Row 2
[25, 75, 125], // Pixel 3
[200, 225, 250], // Pixel 4
],
];
const increaseBrightness = (image, value) => {
// Your code here
};
const newImage = increaseBrightness(image, 30);
console.log(newImage);
/*
Expected outcome:
[
[
[130, 180, 230],
[80, 130, 180],
],
[
[55, 105, 155],
[230, 255, 255],
],
]
*/
</script>
</body>
</html>

41
02_advanced/uebungen/u20_geoquiz-2/index.html Normal file
View File

@@ -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 20: Geoquiz — Teil 2</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 20: Geoquiz — Teil 2</h2>
<p>
In der erweiterten Ausbaustufe sollen die Schüler den Staat zu einer Hauptstadt nennen. Deine Aufgabe ist es
erneut, eine Lösungsfunktion zu programmieren. Dieses Mal nimmt <code>getCountryForCapital</code> eine
Hauptstadt (<code>capital</code>) entgegen und liefert den zugehörigen Staat zurück.
</p>
<p>
Die Funktion soll auf die bestehende Konstante <code>countriesWithCapital</code> zugreifen. Es ist nicht
erlaubt, die Struktur der Daten in der Konstante zu ändern.
</p>
</div>
</div>
</main>
<script>
'use strict';
const countriesWithCapital = [
['UK', 'London'],
['France', 'Paris'],
['Germany', 'Berlin'],
['Switzerland', 'Bern'],
['Austria', 'Vienna'],
['Russia', 'Moscow'],
];
const getCountryForCapital = () => {};
</script>
</body>
</html>

BIN
02_advanced/uebungen/uebungen-14-20.zip Normal file
View File

Binary file not shown.