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-08-19 11:41:58 +02:00
parent c6d9611e81
commit ae9b04f27f
111 changed files with 3878 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
06_js-debug/uebungen/u11_calculate-avg-error/solution.js
View File

@@ -0,0 +1,8 @@
function calculateAverage(numbers) {
const total = numbers.reduce((sum, num) => sum + num, 0);
const average = total / numbers.length;
return average;
}
console.log(calculateAverage([10, 20, 30])); // => 20
console.log(calculateAverage([5, 15, 25, 35])); // => 20

40
06_js-debug/uebungen/u12_find-maximum-error/solution.js
View File

@@ -0,0 +1,40 @@
// logical error
function findMaximum(a, b, c) {
if (a >= b && a >= c) {
return a;
} else if (b >= a && b >= c) {
return b;
} else {
return c;
}
}
const findMaximum2 = (...numbers) => {
return numbers.reduce((max, current) => {
if (current > max) return current;
else return max;
});
};
const findMaximum3 = (...numbers) => {
return Math.max(...numbers);
};
console.time('if else');
console.log(findMaximum(1, 2, 3)); // => 3
console.log(findMaximum(102, 59, 18)); // => 102
console.log(findMaximum(532, 532, 345)); // => 532
console.timeEnd('if else');
console.time('reduce');
console.log(findMaximum2(1, 2, 3)); // => 3
console.log(findMaximum2(102, 59, 18)); // => 102
console.log(findMaximum2(532, 532, 345)); // => 532
console.timeEnd('reduce');
console.time('Math.max');
console.log(findMaximum3(1, 2, 3)); // => 3
console.log(findMaximum3(102, 59, 18)); // => 102
console.log(findMaximum3(532, 532, 345)); // => 532
console.timeEnd('Math.max');

44
06_js-debug/uebungen/u13_temp-converter/assets/js/main.js
View File

@@ -1,17 +1,47 @@
'use strict';
(() => {
// === DOM & VARS =======
const DOM = {};
// ===== DOM =====
const DOM = {
temperatureForm: document.querySelector('#temperatureForm'),
celsiusInput: document.querySelector('#celsius'),
result: document.querySelector('#result'),
};
// === INIT =============
const init = () => {};
// ===== INIT =====
const init = () => {
DOM.temperatureForm.addEventListener('submit', handleFormSubmit);
};
// === EVENTHANDLER =====
// ===== EVENT HANDLERS =====
function handleFormSubmit(e) {
e.preventDefault(); // Standardverhalten unterbinden
const celsius = Number(DOM.celsiusInput.value);
// === XHR/FETCH ========
// falsche Verneinung
if (isNaN(celsius)) {
alert('Please enter a valid number');
return;
}
// === FUNCTIONS ========
const fahrenheit = convertToFahrenheit(celsius);
displayResult(fahrenheit);
DOM.temperatureForm.reset();
}
// ===== FUNCTIONS =====
function convertToFahrenheit(celsius) {
if (typeof celsius !== 'number') return NaN;
return (celsius * 9) / 5 + 32;
}
function displayResult(result) {
DOM.result.textContent = result.toFixed(2);
}
// ===== CALL INIT =====
init();
})();

20
06_js-debug/uebungen/u14_counter-error/index.html
View File

@@ -8,15 +8,17 @@
</head>
<body>
<div class="container py-5">
<h1>Counter</h1>
<div class="counter">
<h1>Counter</h1>
<div class="row mt-4">
<div class="col col-12 col-sm-10 col-lg-6">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">Count:</span>
<input type="text" id="count" class="form-control" value="0" readonly />
<div class="row mt-4">
<div class="col col-12 col-sm-10 col-lg-6">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">Count:</span>
<input type="text" id="count" class="form-control input-count" value="0" readonly aria-label="Counter" />
</div>
<button id="incrementButton" class="btn btn-primary w-100">Increment</button>
</div>
<button id="incrementButton" class="btn btn-primary w-100">Increment</button>
</div>
</div>
</div>
@@ -38,8 +40,8 @@
// ===== EVENT HANDLER =====
function onClickIncrement() {
let count = counter.count;
count++;
let count = ++counter.count;
// count++;
countEl.value = counter.count;
}

31
06_js-debug/uebungen/u14_counter-error/solution.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
@@ -25,18 +25,33 @@
'use strict';
(() => {
// === DOM & VARS =======
const DOM = {};
// ===== DOM & VARS =====
const countEl = document.querySelector('#count');
const btnEl = document.querySelector('#incrementButton');
// === INIT =============
const init = () => {};
let counter = { count: 0 };
// === EVENTHANDLER =====
// ===== INIT =====
const init = () => {
btnEl.addEventListener('click', onClickIncrement);
};
// === XHR/FETCH ========
// ===== EVENT HANDLER =====
function onClickIncrement() {
// variante 1
// let count = counter.count;
// count++;
// counter = { count: count };
// === FUNCTIONS ========
// Variante 2
// counter = { count: ++counter.count }; // hier ist der präfix-inkrement wichtig - der post-inkrement würde ins "leere" gehen, da er erst zugewiesen wird und dann erhöht und diese somit verloren ginge
// Variante 3 - direkt counter.count erhöhren
counter.count++;
countEl.value = counter.count;
}
// ===== CALL INIT =====
init();
})();
</script>