CIS 757 / 790 PROF. AUCIELLO

(acknowledgement to "Plug ‘N Play", New Riders)

 

(javagram.doc)

 

TOPICS:

ELEMENTS—APPLETS—PROPERTIES—HIERARCHICAL STRUCTURE—ON-CLICK--<A> ANCHOR—BOOLEAN (true/false)

 

JAVASCRIPT GRAMMAR:

ARGUMENTS--EVENT-HANDLERS—EXPRESSIONS—FUNCTIONS—LITERALS—METHODS—OBJECTS—OPERATORS--PROPERTIES—STATEMENTS--VARIABLES--VALUES

 

RESERVED WORDS:

 

------------------------------------------------------------------------------------------------------

 

ENGLISH JAVASCRIPT

 

NOUNS = OBJECTS

VERBS = FUNCTIONS

ADVERBS = METHODS

ADJECTIVES = PROPERTIES

 

JAVASCRIPT, VBSCRIPT, WORD BASIC ARE SCRIPTING LANGUAGES (SOFTWARE EXTENSIONS) VS JAVA, VB, C++ (PROGRAMMING LANGUAGES – SELF-CONTAINED, COMPILABLE).

 

JAVASCRIPT IS DESCENDED FROM JAVA AND WAS DEVELOPED BY NETSCAPE TO EXTEND THE FUNCTIONALITIES AND CAPABILITIES OF THE NETSCAPE BROWSER.

 

JAVA CODE IS COMPILED INTO ‘APPLETS’ THAT ARE LINKED TO HTML; JAVASCRIPT IS EMBEDDED DIRECTLY IN THE HTML DOCUMENT.

 

EXAMPLE OF ‘OBJECT’ – FORM ELEMENT SUCH AS A TEXT BOX. ACCESSING THE OBJECT’S PROPERTIES (document.form.textbox.length) PROVIDES THE LENGTH OF A TEXTBOX WITHIN A FORM WITHIN A DOCUMENT.

 

NOTE THAT document-form-textbox ARE HIERARCHICALLY RELATED (SUPERSET-SET-SUBSET)

 

A: ARGUMENTS: VALUES, VARIABLES OR OBJECTS THAT THE METHOD ( FUNCTION/SUBPROGRAM) NEEDS IN ORDER TO WORK.

 

function squareroot(3) à Identify the function, the argument (parameter).

 

------------------------------------------------------------------------------------------------------

 

B: EVENT HANDLERS:

USED TO CALL A JAVASCRIPT: THE EVENT HANDLER CALLS A FUNCTION.

 

Demonstration of onClick alert message:

 

<HTML>

<HEAD>

<TITLE>DEMONSTRATES ALERT MESSAGE</TITLE>

<SCRIPT LANGUAGE="JavaScript">

function pushbutton()

{ alert("This message pops up when the link has been clicked."); }

</SCRIPT>

</HEAD>

<BODY>

<CENTER>

<H1>

<A HREF="members.tripod.com/auciello/index.html" onclick="function()">

Click here to see the index of our CyberClassroom

</A>

</H1>

</CENTER>

</BODY>

</HTML>

 

Students should be able to explain every word, symbol. Note balanced syntax.

Note: Javascript is part of <HEAD>. It is called in the <BODY>

Clicking text with mouse initiates function() triggers the Alert.

Alert messages display text in a dialogue box in response to a user action.

 

 

CATEGORIES OF EVENTS:

 

BUTTON – LINK – WINDOW – FORM – IMAGE – LIVE 3D – LIVE AUDIO – LIVE VIDEO.

 

-----------------------------------------------------------------------------------------------------------

 

C: EXPRESSIONS: SET OF LITERALS, VARIABLES, OPERATORS, EXPRESSIONS DESCRIBING A SINGLE NUMBER, STRING, OR LOGICAL VALUE (BOOLEAN).

 

NewNumber = PrevNumber - 40

 

Identify the variables, the literal (constant), the operators, and the expression.

 

------------------------------------------------------------------------------------------------------------

 

D: FUNCTIONS: SPECIAL STATEMENTS CONTAINING OTHER STATEMENTS THAT EXECUTE WHEN CALLED BY AN EVENT HANDLER. FUNCTIONS ARE ‘SUB-PROGRAMS’ (INDEPENDENT UNITS OF CODE) THAT PERFORM A SPECIFIC OPERATION.

 

QUESTION: WILL A FUNCTION WORK WITHOUT BRACES?

 

function testmessage()

{ alert ("This is very short function." }

 

------------------------------------------------------------------------------------------------------------

 

E: LITERALS: Literals represent values (integers, floating-point numbers, Boolean Values, or strings). AKA "CONSTANT"

 

QUESTION: EXPLAIN DIFFERENCE BETWEEN –

 

1.41412 PI = 1.41412 (literal vs variable)

 

QUESTION: DEFINE INTEGER VS FLOATING-POINT

 

A BOOLEAN VALUE IS EITHER TRUE(1) OR FALSE(0).

 

EXAMPLE OF STRING VALUE" text="this is a literal string that can contain anything except a double quote (do you know why?)"

 

------------------------------------------------------------------------------------------------------------

 

F: METHODS: SPECIAL TYPES OF FUNCTIONS, ASSOCIATED WITH OBJECTS.

 

Methods are a special case of functions.

 

A method using ‘alert’:

alert ("this message is being displaying in a Warning Dialogue Box.")

 

A function:

 

function()

{ alert ("this is a method within a function bracketed by braces!") }

 

QUESTIONS: DESCRIBE HIERARCHICAL RELATIONSHIP BETWEEN METHODS AND FUNCTIONS.

 

WHAT ARE TWO DEFINING FEATURES OF ‘functions()’? (I just gave you one of them).

 

Methods modify objects. (This is like English 101.)

Properties describe objects.; methods modify them.

 

Please connect Java Elements to Parts of Speech:

 

METHOD ADVERB

OBJECT NOUN (SUBJECT)

PROPERTIES VERB

ARGUMENT DIRECT OBJECT

 

Math.sqrt(x)

! ! ! x (argument) = Object

! ! ------sqrt method = Verb

! ------------Math Object = Subject

 

It could be read as "The Math.Object is using the sqrt.method to operate on the variable x.argument to return the square root of x."

 

 

QUESTION: CAN YOU SEE THE NOUN-VERB-OBJECT THING HAPPENING HERE?

 

CATEGORIES OF METHODS:

 

ARRAY

Join – reverse – sort

BUTTON

Click

CHECKBOX

Click

DATE

Getdate – getday – gethours – getminutes – getmonth – getseconds – gettime … parse – setdate – UTC (# of milliseconds since 1st millisecond of JAN.1.1970)

DOCUMENT

Clear – close – open – write – writeln

FORM

Reset – submit

FRAME

Alert – blur – close – close – confirm – focus – open – prompt – etc

HISTORY

Back – forward – go

LOCATION

Reload – replace

MATH

Abs – cell – exp – floor – log – max – min – pow – random – round – sqrt – etc

PASSWORD

Blur – focus – select --

PLUGINS

Refresh

RADIO

Click

RESET

Click

STRING

Anchor – big – blink – bold – charAt – fixed –

Fontcolor – fontsize – indexOf – italics –

LastIndexOf – link – small – strike – sub – subsring – sup – toLowerCase – etc.

SUBMIT

Click

TEXT

Blur – select

TEXTAREA

Blur – focus – select

WINDOW

Alert – blur – close –confirm – focus – open – prompt – setTimeout

 

Built-in Functions:

 

Escape – eval – isNaN – parseFloat – unescape

 

Note all of the above are ‘action words’. They are operators. They operate!

The more verbs (operators) in a language, the more powerful it is.

 

 

G: OBJECTS: OBJECTS ARE THE ELEMENTS OPERATED ON. (NOUNS).

A LOCATION (URL) IS AN OBJECT. YOU CAN CREATE YOUR OWN OBJECTS.

 

document.write("This line appears in the window.")

! ! … write is the method that operates..

! …………... document is the object.

 

The document object is used to write a line in an HTML page.

…………………………………………………………………………………

 

 

H: OPERATORS: THERE ARE (2) TYPES – ASSIGNMENT and ARITHMETIC-STRING-LOGICAL.

 

Rule_of_72 = 72 / interest_rate (find assigment , arithmetic operators, easy)

 

 

I: PROPERTIES: LIKE ADJECTIVES, THEY DESCRIBE NOUNS (OBJECTS).

Use right-hand-button to click on properies of an application.

 

 

J: STATEMENTS: STATEMENTS DIRECT FLOW.

 

IF … THEN … ELSE is a STATEMENT. (directs flow).

 

 

K: VALUES: 5 TYPES: (data types)

 

Numbers – boolean(logical) – strings – null -- date

 

 

L: VARIABLES:

 

Variables are values expicitly-set using an equation.

 

var localvar = 3 * 1.41412

 

localvar is defined as a variable.

 

Note assignment operator (=).

 

Variables can be LOCAL OR GLOBAL:

 

Local … declared within a function, and holds its value only for that function.

 

Global … the variable holds its value, and can be accessed anywhere

Within the <SCRIPT> <./SCRIPT> tags.

 

Global variables are declared before the 1st function:

 

<SCRIPT>

var var1 = 5

 

function test()

{

var var2 = 6 * var1

alert ("Alert the Media! -- 6 * 5 = " + var2)

}

</SCRIPT>

 

QUESTIONS: IDENTIFY THE LOCAL AND GLOBAL VARIABLES?

 

WHAT VARIABLE COULD A 2ND FUNCTION USE?

IS "VAR" A KEYWORD?

----------------------------------------------------------------------------------------------------------

JAVASCRIPT RESERVED WORDS

 

abstract

boolean

break

byte

case

catch

char

class

const

continue

default

do

double

else

extends

false

final

finally

float

for

function

goto

if

implements

import

in

instance of

int

interface

long

native

new

null

package

private

protected

public

return

short

static

super

switch

synchronized

this

throw

throws

transient

true

try

var

void

while

with