Using a variable from one function in an other - think im missing something

Question

this is most probably simple but im struggling a little is it possible to do something like the below becasue its not alerting in the 2nd function.

function func1() {
  var test = 5;
  var testAgain = 8;
}


function func3() {
  func1();
  alert(test);
}

edit:

Thank you all for your comments, however i cant seem to get it to work.

i below is the code i am trying to get this to work in

it does not seem to want to pass the vars from setImageReelWidth, and just alerts 0 when it gets to rotate = function () or $(".paging a").click(function (). so i click and it alerts 4 (which is correct) and then when it runs it twice again i just get 0

var divWidth = 0;
var slideTotal = 0;
var divReelWidth = 0;


function setImageReelWidth() {
    var divWidth = $(".window").width();
    var slideTotal = $(".slide").size();
    var divReelWidth = divWidth * slideTotal;
    alert(slideTotal);
    //Adjust the image reel to its new size
    $(".image_reel").css({ 'width': divReelWidth });
}





$(document).ready(function () {
    ////////////////////////////  INITAL SET UP  /////////////////////////////////////////////

    //Get size of images, how many there are, then determin the size of the image reel.
    //var divWidth = $(".window").width();
    //var slideTotal = $(".slide").size();
    //var divReelWidth = divWidth * slideTotal;

    //Adjust the image reel to its new size
    //$(".image_reel").css({ 'width': divReelWidth });

    //set the initial not active state
    $('#prev').attr("class", "not_active");

    ////////////////////////////  SLIDER  /////////////////////////////////////////////

    //Paging + Slider Function
    rotate = function () {
        setImageReelWidth();
        alert(slideTotal);
        var triggerID = $slideNumber - 1; //Get number of times to slide
        var image_reelPosition = triggerID * divWidth; //Determines the distance the image reel needs to slide
        //sets the active on the next and prev
        if ($slideNumber == 1) {
            $('#prev').attr("class", "not_active")
            $('#next').attr("class", "active")
        }
        else if ($slideNumber == slideTotal) {
            $('#next').attr("class", "not_active");
            $('#prev').attr("class", "active");
        }
        else {
            $('#prev').attr("class", "active")
            $('#next').attr("class", "active")
        };
        //Slider Animation
        $(".image_reel").animate({
            left: -image_reelPosition
        }, 500);
    };

    ////////////////////////////  SLIDER CALLS  /////////////////////////////////////////////

    //click on numbers
    $(".paging a").click(function () {
        setImageReelWidth();
        alert(slideTotal);
        setImageReelWidth();
        $active = $(this); //Activate the clicked paging
        $slideNumber = $active.attr("rel");
        rotate(); //Trigger rotation immediately
        return false; //Prevent browser jump to link anchor
    });

Answer 1

Making the variable available to both methos, by defining it globally, like Rory suggested in his answer, is fine.

Another solution would be to return it from the first function and use it in the second like this:

function func1() {
  var test = 5;
  return test;
}


function func3() {
  var x = func1();
  alert(x);
}

EDIT Another way to do it, is writing a factory function to create func3:

var func3 = (function(){

  var test;

  function func1() {
      test = 5;
  }

  return function() {
      func1();
      alert(test);
  }


})();

What happens here is the following: I created a function, that gets executed right away:

(function(){      
    // ...        
})();

In there, I have the variable test and another function called func1 and I return a function that gets bound to the variable func3. func3 has now access to the var test as well as func1 but nothing outside that factory function I wrote can access them.

Check out the fiddle I created: enter link description here.

Stuff like this is a little hard to understand at first, but it's really the power of JavaScript (IMHO).

Answer 2

You need to declare the variable with global scope.

var test = 0;

function func1() {
    test = 5;
}


function func3() {
    func1();
    alert(test);
}

Further reading on variable scope in javascript