I don't understand parameters in JavaScript functions?

Question

I am completely new to JavaScript and am very confused about what a parameter is in a JavaScript function. What do you put in there? What is it for?

Answer 1

Parameters are basically variables for which the value is set by whatever code CALLS the function before the function starts running.



For instance, let's say I write a JavaScript function that says:



function addNums (arg1, arg2) {

num = (arg1 * 1) + (arg2 * 1);

alert (num);

}



Then, further on, I declare a button to call that function by saying:



add 2 and 3.



Now, when someone clicks on that button, what will happen is that the JavaScript function will be called, and "arg1" will be assigned the value of 2, and arg2 will be assigned the value of 3. The function will then display an alert box with the number "5".



You will notice that I multiplied both parameters by 1 in the body of my function. This is because, unlike many languages, JavaScript does not require you to tell it what a parameter's datatype (i.e. number, character, etc) is when you declare it. Instead, JavaScript tries to figure that out from the way you use it and, frankly, it occasionally makes weird guesses. I multiply by 1 to sort of force JavaScript to assume these are numbers.



Now, if you then added another button to the page, but instead used 6 and 7 for the parameters, like so:



add 6 and 7



then when you click THAT button, the alert message will display "13".



The benefit here is obvious. You only have to write one function. But parameters allow you to pass different sets of values into the function from different calls to that function.



Without parameters, subroutines (such as JavaScript functions) in any programming or scripting language would be far less useful than they are.



@Dominic:



I KNOW it's not "guessing" as HUMANS would do it. I know it uses pre-defined RULES, though I'm not 100% sure that every browser's implementation of those rules is the same. I wasn't implying that it was just random. But it qualifies as a "guess" in my mind, despite the fact that it is made using carefully-coded criteria, because I do not feel those rules are the best set of criteria. Thus, I prefer to cover my backside by making sure that JavaScript is interpreting the variables as I intend. That way, I KNOW it's going to use it as a number.



I suppose you could say the actual "guessing" was done by the developers who created JavaScript and "guessed" at what the proper set of rules would be. I'm not suggesting that JavaScript is self-aware and making conscious choices. But the developers were and did ... I guess.



I've been burned too often by JavaScript interpreting numbers as characters, and when I add 2 and 3, I get "23". For instance, if the first thing you did with arg1 was to add it to the .innerHTML of a

, then it will interpret it as a string (or it did for me ... in IE), not a number, unless you multiply by 1 first. So now, as a practice, I just always multiply by 1 off the bat to remove any doubt.



Frankly, I prefer "strongly typed" languages like PL/SQL and Java ... or even COBOL (stop laughing ... we did amazing things with it back in the day). This business of "I'll decide what the type is when you use it," irritates me. I want to scream, "No ... I'm the developer! I decide what the type is!"

Answer 2

Sometimes you want to give your function some information. You do that by passing it arguments. What you've called parameters.



function addNumbers(num1, num2) {

    alert(num1 + num2);

}



So above a function is defined that takes two arguments, num1 and num2. When calling the function we fill in those arguments with the numbers we want to add.



Add 5 + 3



When the button above is clicked it calls the addNumbers function and gives it the number 5 and the number 3. The function then adds the two numbers and shows the result of the addition in an alert box.



I hope that's easier to understand.



Edit:



Simple! Okay!



You walk up to a the cashier in a fast food place. He's asks what you want to eat. You tell him you want a burger, fries, and a drink. In programming terms you just passed him some parameters.



He sends those parameters (your order) to the kitchen where your food is prepared and the food is brought to you at the counter.



@Arch:



JavaScript doesn't make guesses exactly. It's got rules for these kinda things. If you try adding a string and number then you get concatenation instead of addition. If the multiplication operator is used with a string type then JavaScript will try to coerce the string into a number.



I just kinda take exception to the thought that JavaScript is just choosing types at random. It is a little more work on the programmer's part to check that the arguments passed are the type expected.



@Arch:



Actually every browser does do this the same way. I can use your example. The innerHTML property is a string type. If you use the + operator with a string on either side then the number on the other side of the operator is type converted into a string and the two strings are concatenated.



This happens because the + operator is used for both addition and concatenation. A number can always be converted into a string but a string can't always be converted into a number. So JavaScript assumes that you're doing concatenation when it finds you're using the + operator with a string on either side. (Doesn't Java do this, too?)



If you use any of the other arithmetic operators then JavaScript forces type conversion. If it's successful, the characters represent a number, then addition happens instead of concatenation because both sides of the + operator are number types.



So you can do the following to convert a string to number.



(arg1 * 1)



(arg1 - 0)



Both of those have the chance of changing the string arg1 into a number without changing the value of the result.



Does that make and sense at all?



- Dominic

Answer 3

Normally, in a function, you may declare local variables, like this:



function blah()

{

var asdf;

}



In that case, asdf is a variable which exists only within that call to that function. By default it is null, but we could give it a value and use it for something in that function (or even put its value somewhere else outside of that function's scope). We would call the function like this:



blah();



However, when we define a function, we can also do this:



function blah(asdf)

{

}



Again, in this case, the variable asdf is a local variable which exists only within that call to that function. However, rather than being null by default, because it is set as an argument, we can give it a value when we call the function. Whatever value we specify when we make the call becomes the value of that local variable when that call begins. For instance, imagine if the function were defined like this:



function blah(asdf)

{

alert("blah blah blah "+(asdf*3));

}



In that case, elsewhere we could call it like this:



blah(6);



or put any other expression we like as the argument, for instance:



blah(Math.floor((7*64)/13)-28);



In that case, when the function started, asdf would have a value, and that value would be 6 (you'll notice that, conveniently, the expression I used in the second case here also evaluates to 6). Thus, without ever assigning a value to asdf within the function called blah(), the call to alert() would go through and we would get the following message in an alert box:



blah blah blah 18



You may have more than one argument for a function, in which case they are separated by commas. For instance, a function defined like this:



function blah(asdf,qwer,zxvc,hjkl)

{

}



has four arguments, and when you called it, you would need to pass four values, for instance:



blah(1,2,3+4,"etc");



See how that works?

Answer 4

Read this:



http://www.javascriptatoz.com/javascript-function-arguments