0

How does one pass a variable to one function and then return a value to another function? I have simple example here where I am trying to work it out. The first function accepts the argument 'currpage', returns it to the second function correctly as a number, but then when I call the second function, console.log shows NaN. Not sure what I might be doing wrong.

$(document).ready(function () {

    var currpage = 1;

    $('p').click(function () {
        var xyz = passfrom(currpage); //pass var to function and return value
        console.log(xyz); //returns correct value

        var abc = passto();
        console.log(abc); //NaN
    })
})

function passfrom(currpage) {
    var newpage = parseInt(currpage) * 1000;
    return newpage;
}

function passto() {
    var newcurr = passfrom();
    var newcurr = newcurr * 1000;
    console.log(typeof (newcurr)); //number
    return newcurr;
}   
5
  • typeof NaN is "number", you should know. And there's no need for the second var in the second var newcurr. At any rate: passto() is returning NaN. Commented Jun 12, 2013 at 16:47
  • 2
    you don't pass anything to passfrom() in passto(), you need to pass it a number. Commented Jun 12, 2013 at 16:51
  • 1
    It already has been said but I say it again: var newcurr = passfrom(); <- you are not passing a value to passfrom. Commented Jun 12, 2013 at 17:02
  • The value I want to pass is from the first function, passfrom(). How do I return the value from that function into passto()? You are correct, when I insert value into var newcurr = passfrom(), the function works properly. Commented Jun 12, 2013 at 17:05
  • You defined passform so that it needs an argument. If you want to pass currpage, then you have to pass it to passto first, when then passes it to passfrom. Commented Jun 12, 2013 at 17:06

2 Answers 2

1

How does one pass a variable to one function and then return a value to another function?

A variable is just a little container where you store a value. When you pass a variable to a function, you really pass the value of that variable to it. So in your case:

passfrom(curpage);

and

passfrom(1);

are the same.

Within a function, variable names are used to access these values. These names are totally independent of whatever name was attached to the value outside the function (if it even had a name). They are more like aliases. To distinguish them from variables, we call them parameters. So this one:

function passfrom(currpage) {
    var newpage = parseInt(currpage)*1000;
    return newpage;
}

and this one:

function passfrom(myownname) {
    var newpage = parseInt(myownname)*1000;
    return newpage;
}

are exactly the same. And if we were to write out what actually happens, we'd get this:

// var xyz = passfrom(currpage);
var xyz = value-of(passfrom(value-of(currpage))

So all you have to do to pass a value to some function, is to make sure that it has such a parameter name available by which it can use that value:

function passto(myalias) {
    console.log(myalias);
}

passto(xyz); // writes 1000 to the console.

The above is the actual answer to your question.

To make things a little bit more complicated, there are two more things to take into account:

  1. Scope. The parameter names only work within your function. If they are the same as some variable name outside the function, that outside variable is hidden by the parameter. So:

    var currpage = 1;
    function plusOne(currpage) { curpage += 1; }
    plusOne(currpage);
    console.log(currpage); // 1, as the variable currpage was hidden
    
    function plusTwo(othername) ( currpage += 2; }
    plusTwo(currpage);
    console.log(currpage); // 3, as currpage was not hidden
    
  2. This all works for strings, integers, and other simple types. When you're dealing with more complex types, the parameter name isn't an alias for the value passed to the function, but for the location of the original value. So in that case, whatever you do with the parameter within the function will automatically happen to the variable outside the function:

    var arr = [ 0, 1 ];
    function plusOne(somearr) { somearr[0] += 1; }
    plusOne(arr);
    console.log(arr[0]); // 1, as somearr references arr directly
    

    This is called "pass-by-value" and "pass-by-reference."

Sign up to request clarification or add additional context in comments.

2 Comments

Yes, you answered my question, and thank you for the additional helpful information.
You're welcome. I read in one of your other questions that you are fairly new to programming, and self-taught, so I figured you'd benefit from a little extra information. In the future, if you tackle other programming languages, you might want to keep in mind that they all have different rules about scope and pass-by-value/reference.
1

You're dealing with two different currpage variables, causing one to be undefined when you try to perform arithmetic on it, resulting in a NaN result. See my inline code comments below for further explanation:

$(document).ready(function() {    
    var currpage=1; // Local to this function, because of the var keyword.
    ...
})
}) // I'm assuming this extra closing brace and paren is a typo.
   // Otherwise, your code example has a syntax error or is incomplete.

function passfrom(currpage) { 
   // currpage is the name of the parameter to passfrom.
   // It happens to have the same name as a local var in
   // the document.ready callback above, but the two are
   // not the same.
   var newpage = parseInt(currpage)*1000;
   return newpage;    
}

function passto() {
   // passfrom is called with an implicit 'undefined' argument.
   // Thus, undefined will be used in the arithmetic ops and produce NaN.
   var newcurr = passfrom();

   // Don't need the var keyword below.
   var newcurr = newcurr * 1000;
   console.log(typeof(newcurr)); //number
   return newcurr;
}

You need to make the same currpage variable accessible from both passfrom and passto by putting it in a higher/more global scope or move those functions into the same scope that the original currpage is in. Something like this:

var currpage;

$(document).ready(function () {    
    $('p').click(function () {
        var xyz = passfrom(1); //pass var to function and return value
        console.log(xyz); //returns correct value

        var abc = passto();
        console.log(abc); //NaN
    })
})

// Rename the param so there isn't a naming conflict.
function passfrom(currpageParam) { 
    // If the param is a number, reset the global var.
    if (typeof currpageParam == 'number') { currpage = currpageArg; }

    var newpage = parseInt(currpage) * 1000;
    return newpage;
}

function passto() {
    var newcurr = passfrom();
    newcurr = newcurr * 1000;
    console.log(typeof (newcurr)); //number
    return newcurr;
} 

Be careful though. You'll probably want to take steps to protect your currpage var from outside modification. Also, I suspect that there's a better way to do what you're trying to do, but it isn't clear exactly what that is, so I can't suggest anything.

2 Comments

"Again, assuming that the redeclaration of newcurr is a typo. Otherwise, this is also wrong." It's not technically wrong, it's just unnecessary.
Cool, it didn't know that.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.