Define Functions

Function definition in Javascript is similar to VFP or any c language. You can define function with

function FunctionName(parameter list){
Body of function
}

eg.

function max(a,b){
if (a>b)
return a;
else
return b;
}

Which would be the equivalent of VFP function
Function max(a,b)
If a>b
Return a
Else
Return b
Endif

Functions as objects

In javascript, functions are objects and can be assigned to variables or send to other functions as parameters. This is a concept totally different from anything in VFP. A similar functionality in VFP would require macro substitution.
eg. To start a timer, javascript uses a function called setInterval. This function has 2 parameters, the function that is to be called repeatedly and the interval in which it is to be called.

function sayHello(){
alert(‘Hello’);
}
setInterval(sayHello,5000);

This will say Hello every 5 seconds.

Some functions in javascript require defining callbacks. A method is called and when the method is completed a function is called with the result.
eg. Retrieving data from a database with WebDB would require calling a function like

tx.executeSql('select clientname from client order by clientname’,[],gotTheData,errorGettingData);

In the above example, we are trying to run an SQL statement on a javascript database. This is a slightly time consuming task which could take a time measured in seconds. When it is over, depending on whether the SQL statement returned an error, either the gotTheData function or the errorGettingData function will be called.

The gotTheData function might be defined as

function gotTheData(tx,result){
alert(‘Number of records retrieved=’+ result.rows.length);
}

In VFP you would send function names as strings so you would send ‘gotTheData’ and ‘errorGettingData’ strings and then they would be called with macro substitution.

Notice in javascript, we are not calling them as strings. They do not have quotes surrounding them. They are being send as variables.

Anonymous Functions

In the above example we defined a function gotTheData and gave that name to the tx.executeSql method. Javascript has another way of sending functions as parameters. In this method you do not define the function separately. You simply define the function inline where the parameter is supposed to be. In this case you do not need to give a name to the function and the function is called an Anonymous Function.

The example above would then be changed to

tx.executeSql('select clientname from client order by clientname’,[], function (tx,result) { alert(‘Number of records retrieved=’+ result.rows.length);} ,errorGettingData);

Notice that there is a function definition in the place where I had entered the function name previously. This function is the one that will be called on successful completion of the SQL statement. It no longer needs a name and is now an anonymous function. The example I have given is a single line function, but you are not limited to single line functions. The function defined can be as big as you want.

Variable Scope

Variables in javascript can be global like public or they can be the equivalent of local variables. If a variable is not defined and we just create a variable with an assignment statement, it becomes a global variable. When inside a function, if we use the var keyword, we get local variables.

function SomeFunction(){
var i;

}

Here i is a local variable. var would be similar to the LOCAL keyword in VFP.

This function SomeFunction could have an anonymous function defined inside it. The anonymous function can see the local variable defined by it parent. Eg

function SomeFunction(){
var i;
i=10;
tx.executeSql('select clientname from client order by clientname’,[], function (tx,result) {alert(‘the value of i is ‘+i;} ,errorGettingData);
}

Therefore local variables behave like VFP private variables for anonymous functions defined inside the function.

2 Responses to Javascript vs VFP VI Functions and Variable Scope

  • Anil says:

    Hi Tushar,
    Nice Article as always. I have a question in following line.
    “function gotTheData(tx,result){ ” is Typo in tx,resulut? it should not be tx.result?

    Anil

    • tushar says:

      No. It is not a typo. The function has 2 parameters. tx and result. tx is the pointer to the transaction variable and result is where the result of the SQL is stored.

Leave a Reply

Your email address will not be published. Required fields are marked *