WISDOMBAY

in4mation ... organized

First Page of this Article | Second Page of this Article | Third Page of this Article

Master Javascript by Typing PART II

Page 1

A series by Pramod S Nair for Wisdombay (originally published in www.spidercreationsindia.com)

Master Javascript by Typing Part II

A Summary of what we learned in last issue
The first part of this article introduced you to the different ways in which you can incorporate javascript to your files. We are treading in to more deeper waters in this issue.

OK ! Let's start our new odyssey through the world of Javascript.

CLASS IV - Calling our first function.

Functions are self contained code segments which pertains with a specific task to be accomplished. The advantage of using functions is that we can split our programs in to small modules, with each module handling a certain task. You can limit the number of lines of codes needed to a large extent using Functions. Now we can look how a function can be declared and used in javascript.

The syntax of writing or declaring a function in javascript is like given below,

function functionname(argumentlist)
{
//Function body here
}

Here the keyword function should be used as it is. The next thing, that is 'functionname', can be any name that you like by which to call your function. It is a good idea to use meaningful names. The argument list is a number of entities that you want to pass in to your function. I will elaborate on that later & arguments are optional. The body of the function or its contents gets interspersed or written between the { & } braces.

You can call such declared functions from event handlers (as we have seen in our first issue, the usage of onClick() event handler) or from other functions or even from itself. We can make the concepts clear by using an example.

Lets get our hands dirty by messing around with a bit of code.Here we are going to write a function to identify the client browser and display it in browser window. We are going to call the function when the page gets loaded. This can be accomplished by using the onLoad() event handler.

<html>
<head>
<title>My first script</title>
<script language="JavaScript">
function getClientBrowserInfo()
{
var info
info =""
info =info + "Code Name of Browser : "+ navigator.appCodeName +"\n"
info = info + "Name of Browser : " + navigator.appName +"\n"
info = info + "Version : " + navigator.appVersion +"\n"
info = info + "Platform : " + navigator.platform+"\n"
info = info + "CPU Class : " + navigator.cpuClass +"\n"
alert(info)
}
</script>
</head>
<body onLoad="getClientBrowserInfo()">
<h1> This page displays Browser properties on Loading
</body>
</html>


Launch your Text Editor, type the above given code & save as fourth.html (or any other name you prefer). Now view the file that you created in browser & you will see a dialog box that displays some basic info about your client browser, i.e. the browser that you are using.



Analysing the code

In the above code in the head section you defined a function called getClientBrowserInfo(). Take a note that you are not sending any arguments in to the function here. The sentance
function getClientBrowserInfo() starts the declarative phase of this function. In this function we are making use of the object called navigator to get the required information about browser.

First of all we have declared a variable called info by using the statement var info. Then we set the variable to null or empty by using info = "".

Now lets analyse the info =info + "Code Name of Browser : "+ navigator.appCodeName +"\n" sentence.

First Page of this Article | Second Page of this Article | Third Page of this Article

Google