What could be the purpose of index in the if statement?

JavaScript
1

Screenshot%20(633)

let SLIDEINDEX = 0;

showSlide(SLIDEINDEX)

function showSlide(index) {

	let picture = document.querySelectorAll('.pictures');

	if (index >= picture.length) SLIDEINDEX = 0;
	if (index < 0) SLIDEINDEX = picture.length -1;

	for (let i = 0; i < picture.length; i++) {
		picture[i].style.display = 'none';
	}

	picture[SLIDEINDEX].style.display = "block";

}

setInterval(function(){showSlide(++SLIDEINDEX)}, 5000);
2

The function shows a particular picture from a list of pictures by its index in the list

It checks whether or not the provided index is within the valid indices of the list, and if not, sets it to a specific valid index for each case

3

@codeca423 Also, I think it might make the code more clear if let picture = document... were changed to let pictures = document... so it’s clear that it’s an array of elements with the .picture class rather than one picture.

4

Screenshot%20(633)

let SLIDEINDEX = 0;

showSlide(SLIDEINDEX)

function showSlide(index) {

	let picture = document.querySelectorAll('.pictures');

	if (index >= picture.length) SLIDEINDEX = 0;
	if (index < 0) SLIDEINDEX = picture.length -1;

	for (let i = 0; i < picture.length; i++) {
		picture[i].style.display = 'none';
	}

	picture[SLIDEINDEX].style.display = "block";

}

setInterval(function(){showSlide(++SLIDEINDEX)}, 5000);
5

First of all, please don’t use images of code. Just cut and paste the text of the code.

As far as “What is the purpose of index inside if statement”, it’s hard to tell exactly what you mean so I’ll just pick one and go with that.

This function is to show slides. You are passing in a variable index to tell it which slide to show. Remember that if there are 10 slides, the indexes will be from 0-9. So, if the index is bigger or equal to 10 (index.length) then they’ve chosen an index past the end, so just go back to the beginning. The second line says that if they’ve been going backwards and try to chose one before the beginning (less than 0), then go to the last image.

These two lines handle if they are scrolling through the images. If they go past either end, it will just go to the other end so they can continuously loop through. This is how slide shows typically work.

6

Please do not create multiple topics for the same question. I have merged your posts into the original topic.