木曜日, 1月 26, 2006

Introduction to JavaScript

Scholorship (something to shoot for) .
My mini-plegurization series on the mysteries of wireless will have to be postponed because I bombed this weeks quiz in programming, in order to make amends I decided to plagurize Vince Offenbacks classnotes on JavaScript. Thanks Vince! (hope this doesn't piss you off)

Introduction to JavaScript
html is fine for creating web pages that present static (unchanging) information. Adding JavaScript, however, will allow us to create dynamic pages that:
1. get information from the user
2.perform calculations based on that information, and
3. display the results of those calculations.

First let's recall what a computer program is. It is an ordered sequence of instuctions that the computer follows to complete some task. A computer program usually follows this basic form.

""""""""""""'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
INPUT |---------> | PROCESS |------->| OUTPUT |
-----------------------------------------------------------------------

Where some of this information or direction is input to the program, the program processes this and produces a result. JavaScript programs are interesting in that
they run from within a browser.

Some Background
Yet how is it that computer programs can be written in JavaScript, or Java, or C++,
or a multitude of other languages? That requires a history lesson...

The language that a computer executes is known as machine language. Machine language
has very simple instructions such as ADD, LOAD, and STORE and these instructions
are written in binary numbers (unlike the number system we use which is decimal).
This language is not easy for humans to write and understand (Unless your L33T).
But those early programming pioneers did just that.(Was that b4 Denise Ritchie
Prof. Offenback?) Back in the 1940s, programmers wrote programs in the computers
language, the machine language. Not a whole lot of fun.

As these programmers got smarter, they where able to write programs using hexidecimal numbers (like what we used for custom colors) (my.02- yeah like the output from
the PRL off your phone that gives details on your digital plan)Definitely an
improvement over binary, but still only comprehensible by the most technical people.
What was needed was a language for the masses.

The programming languages that came next are called high level languages.

(my.02-
Assembly language is more work but it has its advantages. A very nice feature of assembly language code, which it shares with Linux itself incidentally, is that from a crass performance standpoint, it functions beautifully. Relying on compilers to produce good code is usually justifiable as a time saving measure. But to get the best possible code, there is still no better option than to use assembly language. When high-level languages were still a novelty and referred to as automatic programming, many programmers were greatly offended by them. They were convinced that no compiler program could write code as well as they could. They were right of course. Compilers produce cheaper code but not better code. To get the full measure of speed and grace that a machine is capable of, there is no substitute for assembly language.
taken from Linux assembly language programming.)

They are much more like English-like. Some of examples of these languages are Basic ( beginers all purpose instruction code--was learning this in the fifth grade, but got lazy) ,
Fortran, C, Java, and JavaScript. Note that there are many other languages out there; this is just a subset. People like to write software using these languages because they are easy to read. But the computer did not change; it still "spoke" machine language.

So how is a program in a high level language translated into the machine level language that the computer can understand? That is a job of another piece of software known as a translator
(also known as a compiler or interpreter). For languages like C and Java, there are compiler programs that do the translation. In the case of JavaScript, browsers handle the task of translation.

Your First JavaScript Program
Here is an example of a simple JavaScript program
<html>
<head><title>First JavaScript Program </title></head>
<body>
<p>This text is written in html. </p>

<script language ="JavaScript">
<!-- Conceal from non-JavaScript Browser.
window.document.write("This text is written using JavaScript! <br");
window.document.write(" <b> <i>Tags </i>need to be included! </b> <br>");
//-->
</script>

<p>Now the script is finished and we are writing in html again. </p>
</body>
</html>

This example adds JavaScript code to a web page by making use of a <script> tag, which you can see is a container tag. The script tag has 1 attribute that we will use (there are others that we dont need). That is the language attribute. As you can see from the example, the value we assign it is JavaScript.

Now the next line is a bit odd. Notice that it is the beginning of an html comment tag; and the html comment contains the entire JavaScript code! This is a precaution: if someone opens this page with an old browser that cannot interpret JavaScript code, the code will be ignored by the browser, since it is nested in an html comment. Newer browsers that understand JavaScript will be able to see the JavaScript code, even though it is within the comment tags.

Once we get to the line that starts window.document.write the browser is processing the script. the 2 JavaScript lines that begin window.document.write display text to the webpage. We'll learn more about the syntax below.

Now how about the line//-->. (this is a bit confusing, so hang on.) Remeber that we nested the entire JavaScript code within an html comment tag. Well, once the browser is in "processing JavaScript" mode, in effect it ignored the beinning of the html comment, so we don't want it to see the ending of the html comment. We want the JavaScript processing to ignore the -->. So we use a JavaScript comment. A JavaScript comment is two forward slashes//. Anything on the line after the // is ignored. So the --> is there to close the html comment tag: used by browsers that can't interpret JavaScript. We have to put that in a JavaScript comment, //-->, so that browsers that are interpreting the JavaScript will ignore the closing html syntax. Whew!

So the JavaScript code we write will be embedded in these four lines:

<script language=" JavaScript">
<!--Conceal from non- JavaScript Browsers.

//-->
</script>

As we look at the code in the book and in the examples, see if you can spot this pattern over and over again. It will make your life easier if you create a template.html file with the basic html structure tags and these tags already in it. Then you can keep reusing it over and over for all your work.

JavaScript Objects
Like many modern programming languages,
JavaScript is an object-oriented programming language. This means that programs, including the capabilties that are built into the language for the programmer to use, are organized as a collection of 'software objects'. In the real world, an object is a thing that can be described (has certain characteristics or attributes) and can perform certain actions. For example, a car has certain characteristics, like its color, its make, the amount of gas currently in it, the amount of oil etc.

A software object also has characteristics and can perform actions, a software object is made up of properties, or attributes. These properties have names and associated values which are stored in memory (similar to the idea of attributes and values of html tags). Objects also have methods which are blocks of program statements that provide the instructions for performing a particular action. The names of properties should be nouns or noun phrases), like title. The names of methods should be verbs (or verb phrases), like write. An object properties and methods taken together are called its members.

1 Comments:

Blogger Mad Russian the Natural Philospher said...

Stu,

I feel your pain. I love math but I burned the fudge big time on my latest test (in Trigonometry, no less--one of my favorite topics).

We can only persist in the pursuit of aeternal truths (of the created order) or we sink to the mindlessness of so many people.

Hang in there--I'm saying this for myself also. :(

12:47 午前  

コメントを投稿

Links to this post:

リンクを作成

<< Home