Member Avatar for Archenemie

I have been tasked to learn basic JavaScript as part of my collage coarse, and i've taken this section if code from the W3C website and commented it out.

Is my interpretation of what this script is doing correct?

Im using this script as an example of how JavaScript can be used to validate information client side.

Thank you for your time. Any additional info that can further my understanding is appreciated.

<html>
<head>
<script type="text/javascript">  //This tells the browser the following is JavaScript.

function validate_email(field,alerttxt) //This defines the function.
{
with (field)
  {
  apos=value.indexOf("@"); //Tries to find the position of the value given.

  dotpos=value.lastIndexOf("."); //Tries to find the last occurrence of the value given.
  if (apos<1||dotpos-apos<2) //checks there is a “.” after the “@” character. || is and operator.
     {alert(alerttxt);return false; //If there is not open an alert box.
  else {return true;} //true and false are boolean values to be used later
  }
}

function validate_form(thisform) //New function.
{
with (thisform)
  {
  if (validate_email(email,"Not a valid e-mail address!")==false) //Check outcome of previous function.
  {email.focus();return false;} //not sure what this specifically does. I know its to do with setting the | back in the box, but i think it does it after the alert box is closed?
  }
}
</script>
</head>

<body>
<form action="submit.htm" onsubmit="return validate_form(this);" method="post">
calls functions from header and ties it to the submit button (EDP).
Email: <input type="text" name="email" size="30"> creates the input box object.
<input type="submit" value="Submit"> creates the submit button.
</form>
</body>

</html>
Edited by Archenemie because: n/a
  • 2 Contributors
  • 2 Replies
  • 115 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by Archenemie
Member Avatar for Airshow

Is my interpretation of what this script is doing correct?

Nothing wrong with your understanding thus far, Archenemie.

Some notes ...

with with is unloved and deprecated. I don't understand the full reason but most people avoid it.

Purpose
Javascript's main raison d'etre is to interact with (X)HTML/XML documents and has many inbuilt methods which allow it to fulfill this role. For example, .focus() is a method which gives focus to several types of document element, as if the user had left-clicked on that element.

Scope
Javascript's outermost or global scope is window . Members instantiated outside functions are always global.

Functions can be (and frequently are) nested (you can declare a function within a function). This leads to the concept of "inner" and "outer" scopes. Few patterns go more than two or three levels deep.

Most members instantiated within functions are only local if declared with var ; otherwise they are created in the global scope. Function are the exception. The expression function foo(){...} is identical to var foo = function(){...} . Whichever syntax is used, the function is created within the current scope. foo = function(){...} (without var) follows the general rule and would create a function in global scope regardless of where it was instantiated.

Each function has its own scope with access to all outer scopes, all the way out to global. When a member is referred to, the interpreter looks first at the local scope, then the next outer, next outer etc., until it finds a member of the name used.

It is possible (and generally advised) to put minimal members in the global scope. It is often possible to create web pages with no global members at all. This is considered good practice.

Functions as first class objects
Functions can be passed as formal parameters in function calls and can be created within functions then returned. This feature is often very alien to programmers schooled in other languages.

Anonymous functions
Functions don't need to be named. It is quite common for functions designed to be passed around not to be named at their point of creation.

Closure
Javascript functions exhibit a feature known as "closure", by which members can remain alive and internally accessible within functions even after the function has completed and returned. This is an extremely important feature of the language that can be exploited to access members that would otherwise be out of scope. By deliberately employing closures, we can avoid having to create global members or the need to hide data in the document (the DOM).

Private and Public members
Thanks to closures, we can create objects with both private and public members. This is achieved by using an appropriate pattern. There are no keywords "public" or "private".

Classes
Javascript doesn't have classes as such. However, various patterns are available, which allow class-like behaviour to be created. All such patterns a built around functions. Inheritance can be of several types, the most common and most natural of which is "prototypal inheritance".

Keywords
Javascript is rather odd in that it has a number of keywords that don't appear in the language itself. For example, "class" is not a keyword but creating a member or a object property named "class" is asking for trouble.

If you want to know more on any of these points and more, then read/watch everything you can by Douglas Crockford.

Airshow

Edited by Airshow because: n/a
Member Avatar for Archenemie

Thanks very much.

This will really speed up my learning.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.