Skip to content

add task solution #1749

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
vectormeleshko wants to merge 3 commits into
base: master
Choose a base branch
from
Open

add task solution #1749

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
4911ddd
add task solution
vectormeleshko Apr 21, 2026
3060b68
add task solution2
vectormeleshko Apr 22, 2026
528ff15
add task solution3
vectormeleshko Apr 22, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@
/>
</head>
<body>
<div id="tree"></div>

<script src="scripts/main.js"></script>
</body>
</html>
16 changes: 15 additions & 1 deletion src/scripts/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,21 @@ const food = {
const tree = document.querySelector('#tree');

function createTree(element, data) {
// WRITE YOUR CODE HERE
if (!element || Object.keys(data).length === 0) {
return;
Comment on lines 23 to +31
Copy link
Copy Markdown

@mateacademy-ai-mentor mateacademy-ai-mentor Apr 21, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Edge case: the function returns early when Object.keys(data).length === 0. This prevents creating empty

    for empty objects, which is fine, but be careful: if data is not an object or is null/undefined this will throw. Consider validating that data is an object (e.g., check data && typeof data === 'object'). This addresses robustness though not required by the task.

}
Comment on lines 23 to +32
Copy link
Copy Markdown

@mateacademy-ai-mentor mateacademy-ai-mentor Apr 21, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minor behavior note: when element is falsy or data is empty the function returns without modifying element. This matches the simple task requirements, but if element is present and data is empty you may want to leave it unchanged or explicitly clear its contents depending on desired behavior.


const ul = document.createElement('ul');

for (const a in data) {
const li = document.createElement('li');

li.textContent = a;
createTree(li, data[a]);
ul.appendChild(li);
}
Copy link
Copy Markdown

@mateacademy-ai-mentor mateacademy-ai-mentor Apr 21, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using for...in iterates over enumerable properties from the prototype chain as well. If the data objects are plain objects (as in the task), this is fine. If you want to be strict, use Object.keys(data).forEach(...) or guard with hasOwnProperty. Consider this if unexpected prototype properties may appear.


element.appendChild(ul);
}
Copy link
Copy Markdown

@mateacademy-ai-mentor mateacademy-ai-mentor Apr 21, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The function createTree is implemented and uses recursion to create nested UL/LI lists from the data object, matching checklist items #1, #2 and #8. (See function body)


createTree(tree, food);
Comment on lines 21 to 49
Copy link
Copy Markdown

@mateacademy-ai-mentor mateacademy-ai-mentor Apr 21, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The element parameter is used as a DOM element (passed tree obtained via document.querySelector('#tree')), satisfying checklist item #3. (lines 21, 41)

Loading