Understanding function parameters

Question

This probably has been asked before but all I can find are questions regarding C and Bash etc.

Basically I'm having a really hard time getting my head around function parameters and what they reference.

I know that you usually set paramters when you call the function e.g. doSomething(3,'Hello') etc, but when I read code from tutorials like so;

window.onload = initAll;

function initAll() {
    if (document.getElementById) {
        for (var i=0; i<24; i++) {
            setSquare(i);
        }
    }
    else {
        alert("Sorry, your browser doesn't support this script");
    }
}

function setSquare(thisSquare) {
    var currSquare = "square" + thisSquare;
    var colPlace = new Array(0,0,0,0,0,1,1,1,1,1,2,2,2,2,3,3,3,3,3,4,4,4,4,4);
    var colBasis = colPlace[thisSquare] * 15;
    var newNum = colBasis + getNewNum() + 1;

    document.getElementById(currSquare).innerHTML = newNum;
}

function getNewNum() {
    return Math.floor(Math.random() * 15);
}

Where is setSquare() getting the parameter of thisSquare from?

Are you referring to the call `setSquare(i)`? I'm not entirely sure what your question is. — Greg Hewgill, Jan 09 '12 at 22:20

score 1 · Answer 1 · answered Jan 09 '12 at 22:21

1

Inside of initAll there is the following code:

for (var i=0; i<24; i++) {
   setSquare(i);
 }

So initAll is calling setSquare 24 times. Each time passing in the value of i. (0, 1, 2, etc.). So the value of i is thisSquare

answered Jan 09 '12 at 22:21

Brandon

68,708
30
194
223

score 1 · Accepted Answer · answered Jan 09 '12 at 22:22

1

In your first function initAll(), you are calling setSquare(i). In this case, the i is the parameter. According to initAll(), i is a number in the for loop. Essentially what's happening is you're calling setSquare for each square number 0 to 24.

The setSquare() function has renamed the i to thisSquare. Now anywhere inside the setSquare() function, thisSquare is set to the same value that i had before.

Hope that helps, good luck.

answered Jan 09 '12 at 22:22

Jemaclus

2,356
1
15
13

Pretty much perfect .... I love clear answers ... bravo ..... Just one more question if you don't mind with regards to setSquare(i), is that basically calling the function before the function has been created? – PI. Jan 09 '12 at 22:30
@17bc17: no, JavaScript interpreters "hoist" named `function` definitions to the top of the scope. So before actually running the code, the interpreter translates it into something like this: http://pastie.org/3157006 – Peter-Paul van Gemerden Jan 09 '12 at 22:36
@PPvg - Thanks for the reply, its much appreciated. Do you have any links which explain this in more detail?, just I'm pretty new to this. – PI. Jan 09 '12 at 22:38
1

@17bc17: [This question on SO](http://stackoverflow.com/questions/7506844/javascript-function-scoping-and-hoisting) is a pretty interesting read. Or MDN, of course: [MDN: Hoisting](https://developer.mozilla.org/en/JavaScript/Reference/Scope_Cheatsheet#Hoisting) and [MDN: Functions and function scope](https://developer.mozilla.org/en/JavaScript/Reference/Functions_and_function_scope). – Peter-Paul van Gemerden Jan 09 '12 at 22:41

score 0 · Answer 3 · answered Jan 09 '12 at 22:22

0

setSquare is being called in the initAll function, which passes it a value, from 0 to 23. The initAll function is called when the page is loaded (in theory).

answered Jan 09 '12 at 22:22

Pat

2,228
3
24
33

score 0 · Answer 4 · answered Jan 09 '12 at 22:25

0

It is getting it from the for loop in the initAll() function in this case, but it could get it from wherever you call setSquare function

answered Jan 09 '12 at 22:25

Arturo Martinez

3,737
1
22
35

score 0 · Answer 5 · answered Jan 09 '12 at 22:25

0

Where is setSquare getting the parameter of thisSquare from?

Right here: setSquare(i);

Inside the setSquare function currSquare ends up being the id of a Dom element (for example, currSquare1).

answered Jan 09 '12 at 22:25

Kris Krause

7,304
2
23
26

Understanding function parameters

5 Answers5