149 lines
4.3 KiB
HTML
149 lines
4.3 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Übung 9: Tiefste Ebene eines verschachtelten Arrays finden</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-warning">
|
|
<h2>Übung 9 (advanced): Tiefste Ebene eines verschachtelten Arrays finden</h2>
|
|
<p>
|
|
Schreibe eine rekursive Funktion in JavaScript, die die tiefste Ebene eines verschachtelten Arrays bestimmt.
|
|
Die Funktion soll die maximale Verschachtelungstiefe des Arrays zurückgeben.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<script>
|
|
'use strict';
|
|
|
|
const findDeepestLevel = (arr, currentLevel = 1) => {
|
|
if (arr.length === 0) {
|
|
return currentLevel;
|
|
}
|
|
|
|
let maxLevel = currentLevel;
|
|
|
|
// Array durchlaufen
|
|
for (let i = 0; i < arr.length; i++) {
|
|
// wenn element array
|
|
if (Array.isArray(arr[i])) {
|
|
/* currentlevel um eins erhöhen und rekursiv wieder aufrufen und neue tiefe ermitteln. Wenn der letzte Aufruf von findD... abgeschlossen wird, wird die dort ermittelte Tiefe zurückgegeben usw...*/
|
|
const depth = findDeepestLevel(arr[i], currentLevel + 1);
|
|
// wenn tiefe höher als momentan max Tiefe, neue tiefe setzen
|
|
if (depth > maxLevel) {
|
|
maxLevel = depth;
|
|
}
|
|
}
|
|
}
|
|
|
|
// neue tiefe zurückgeben
|
|
return maxLevel;
|
|
};
|
|
const findDeepestLevel2 = (arr, currentLevel = 1) => {
|
|
if (arr.length === 0) {
|
|
return currentLevel;
|
|
}
|
|
|
|
let maxLevel = currentLevel;
|
|
|
|
// Array durchlaufen
|
|
arr.forEach((item) => {
|
|
if (Array.isArray(item)) {
|
|
const depth = findDeepestLevel2(item, ++currentLevel); // Rekursion
|
|
if (depth > maxLevel) {
|
|
maxLevel = depth;
|
|
}
|
|
}
|
|
});
|
|
|
|
// neue tiefe zurückgeben
|
|
return maxLevel;
|
|
};
|
|
|
|
const numbers = [
|
|
1, //
|
|
[
|
|
2, //
|
|
[3],
|
|
],
|
|
[1],
|
|
];
|
|
|
|
console.log(numbers[0]); // => 1
|
|
console.log(numbers[2]); // => [1]
|
|
console.log(numbers[2][0]); // => 1
|
|
|
|
const data = [
|
|
'wert', //
|
|
[
|
|
'wert', //
|
|
'wert',
|
|
'wert',
|
|
[
|
|
'wert', //
|
|
'wert',
|
|
[
|
|
'wert', //
|
|
'wert',
|
|
['wert'],
|
|
],
|
|
],
|
|
],
|
|
];
|
|
|
|
console.log(findDeepestLevel(data)); // => 5
|
|
console.log(findDeepestLevel2(data)); // => 5
|
|
console.log(findDeepestLevel([1, [2, [3]], [1]])); // => 3
|
|
|
|
// const findDeepestLevelIte = (arr) => {
|
|
// if (arr.length === 0) {
|
|
// return 1;
|
|
// }
|
|
|
|
// console.log('Länge des Arrays: ', arr.length);
|
|
|
|
// let depth = 0;
|
|
// for (let i = 0; i < arr.length; i++) {
|
|
// // console.log('i: ', i, ' arr.length: ', arr.length);
|
|
// if (Array.isArray(arr[i])) {
|
|
// depth++;
|
|
// console.log('depth wird erhöht: ', depth);
|
|
// } else {
|
|
// console.log('kein Array');
|
|
// }
|
|
// }
|
|
|
|
// return depth;
|
|
// };
|
|
|
|
// Test cases
|
|
console.log(findDeepestLevel([1, [2, [3]], [1]])); // => 3
|
|
console.log(findDeepestLevel([1, [2, [3, [4]], 5]])); // => 4
|
|
console.log(findDeepestLevel([1, 2, 3, 4, 5])); // => 1
|
|
// console.log(findDeepestLevel([])); // => 1
|
|
// console.log(findDeepestLevel([1, [2], [3, [4, [5]]]])); // => 4
|
|
// console.log(findDeepestLevel([1, [2, [3]], [4, [5, [6]]]])); // => 4
|
|
|
|
// const $on = (el, ev, fn) => {
|
|
// Array.isArray(el) ? el.forEach((ae) => $on(ae, ev, fn)) : el.addEventListener(ev, fn);
|
|
// return el;
|
|
// };
|
|
|
|
// $on(Array.from(document.querySelectorAll('li')), 'click', (e) => {
|
|
// console.log('click');
|
|
// });
|
|
|
|
// Array.from(document.querySelectorAll('li')).forEach((el) => {
|
|
// el.addEventListener('click', (e) => {
|
|
// console.log('click');
|
|
// });
|
|
// });
|
|
</script>
|
|
</body>
|
|
</html>
|