CODEWITHSUNDEEP
javascript
tobi1512
tobi1512

Reputation: 159

variable without assigned value in javascript

why we are using variable without assigned value like in this function var i;:

function showSlides() {
    var i;

    var slides = document.getElementsByClassName("mySlides");
    for (i = 0; i < slides.length; i++) {
        slides[i].style.display = "none"; 
    }
    slideIndex++;
    if (slideIndex > slides.length) {slideIndex = 1} 
    slides[slideIndex-1].style.display = "block"; 
    setTimeout(showSlides, 2000); 
}

I mean its working without this, so im curious what is it for, i know that we can check in the loop whether the value is undefined, but i dont see another usage

Upvotes: 0

Views: 1320

Answers (5)

jcaron
jcaron

Reputation: 17710

To add to @fenton’s answer:

  • in legacy JavaScript, you don’t even need to declare variables. But you definitely should. Add "use strict"; at the beginning of your source code to make sure you don’t forget;

  • the scope of variables in legacy JavaScript is not obvious. Even though JavaScript is C-style, variables don’t have block scope, but function scope. So it’s a good idea to declare all your variables at the start of the function to make the clear and explicit.

Upvotes: 0

Patrick Hund
Patrick Hund

Reputation: 20236

It is important to define variables with var (or, in modern JavaScript, with let or const) to set the scope of the variable.

A variable defined with var is valid within the function where it is defined. If you omit the declaration, the code will still work, but i will be defined in the global scope and may interfere with other functions that use the same variable name.

Where you put your var statement actually doesn't matter, but it is good practice to put it at the beginning of the function to make the code easier to read and avoid errors.

You might also have written your code like this:

function showSlides() {
    var slides = document.getElementsByClassName("mySlides");
    for (var i = 0; i < slides.length; i++) {
        slides[i].style.display = "none"; 
    }
    slideIndex++;
    if (slideIndex > slides.length) {slideIndex = 1} 
    slides[slideIndex-1].style.display = "block"; 
    setTimeout(showSlides, 2000); 
}

Upvotes: 1

Taha Paksu
Taha Paksu

Reputation: 15616

Because it's used for index value in for loop and initialized in the for loop's initial value part, it's safe to use it. It's acting like this:

var some_value = 10;
for(var i = 0; i < some_value; i++){
   console.log(i, "looped");
}
console.log(i);

is equal to 

var some_value = 10, i;
for(i = 0; i < some_value; i++){
   console.log(i, "looped");
}
console.log(i);

i can be used in the same scope (function body for your case), because it's defined in the same scope.

Upvotes: 0

user2887596
user2887596

Reputation: 643

One of the reasons is scoping (if you are inside of your global scope) :

Lats say I have the following function 

function test(){
   //code code code
   i=3
   //code code code
}

There is now way I can access that i from outside the function test. But if I do :

var i;
function test(){
   //code code code
   i=3
   //code code code
}

Now the "i" outside the function test is the same as the "i" inside of that function. Whether or not this is good code design is an other discussion.

Upvotes: 1

Fenton
Fenton

Reputation: 250942

The variable is used within the loop a few lines later. When using the var keyword to declare variables, the variables are "hoisted" to the start of the function, so even if you write:

function showSlides() {
    var slides = document.getElementsByClassName("mySlides");
    for (var i = 0; i < slides.length; i++) {
        slides[i].style.display = "none"; 
    }
    slideIndex++;
    if (slideIndex > slides.length) {slideIndex = 1} 
    slides[slideIndex-1].style.display = "block"; 
    setTimeout(showSlides, 2000); 
}

The variable i is still technically declared at the top of the function.

If you omit the variable declaration altogether, the i variables ends up in the global scope, which will cause you problems as it will be shared with other functions that also fail to declare the variable locally - so you will eventually have side-effects (and they are hard to debug).

Upvotes: 1

Related Questions