Assessment wanted for Image gallery. (Task-1)

MDN Learn
#1

Assessment wanted for Image gallery. (Task-1)

Link to task: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery#starting_point

Link to my code:
Task-1: https://jsfiddle.net/EiNzp/wq21fr46/12/

Thanks :wink:

#2

Great work, @EiN!

Everything’s fine. Nice idea with the alt texts.
You could make the assignments a bit simpler by using the dot notation like you did with displayedImage.

And here comes the bonus question :sunglasses::
Having two connected data sets in different structures (imagesNames and altText) can be fragile. Try to rewrite them into an array of objects. Each object in the array should contain an url and an altText property with the necessary values. You can then loop over this new array to fill the imageThumbBar.

Good luck,
Michael

1 Like
#3

Hello. Thanks for checking my code and for the bonus question :slightly_smiling_face:. Here is a link to my new code with an answer to the bonus question and a slight adjustment to the previous code:
Task-1: https://jsfiddle.net/EiNzp/yh5g3tvj/3/

#4

Cool rewrite, @EiN.
Now it feels much more robust.

Since we now have all required information in our objects, we don’t need the index anymore and could now also use a for...of loop.

for (const image of images) {
  ...
}

But that’s more a matter of taste. I like this kind of loop. It looks simpler to me. (As long as you don’t need the index).

1 Like
#5

Yes, you’re right, it’s really easier that way. And it is almost impossible to make a mistake, unlike my version.
Here is the modified code: https://jsfiddle.net/EiNzp/zhewvyk2/4/

1 Like
#6

Beautiful code ! :+1:

1 Like