CSC 112 Intro to Computer Programming in JavaScript Spring 2005

Internet and WWW u Internet and WWW are not the same – Internet includes and other things u Internet is the computers and the means by which they physically connect to each other. u World Wide Web is the logical means of accessing the files on these computers, primarily as web pages.

Using the World Wide Web u Browsers Netscape Navigator Internet Explorer u Plug-ins Java Macromedia Flash Acrobat Reader … u Search Engines Yahoo and many others

Internet Protocols u TCP/IP – Transmission Control Protocol / Internet Protocol u FTP – File Transfer Protocol u http – Hypertext Transfer Protocol u telnet – for remote login to other computers, with local computer as dumb terminal

IP Addresses u Example – u For specific computers on the Internet u Information is passed between them in packets u A named address (next slide) is converted to an IP address by a Domain Name Server (DNS)

Named Addresses URL’s – Uniform Resource Locators http is the protocol com is the domain – others are edu, org, gov, … www. music.sony.com is the server computer Music is the folder on the server computer index.html is the file in the Music folder

Hypertext Markup Language u Describes with tags how web page should be formatted for display by browser u Container tags, thus and u Non container tags, thus or u Tags must be properly nested

Basic Skeleton of an HTML Page … …

Tags for Lists For an unordered list … For an ordered list …

Attributes of HTML Tags u Describe how to accomplish a result u Attributes may or may not have values, as in …. u BODY attributes include colors for links and for background u FONT attributes include color and size

Hypertext Links u anchor text (Absolute or relative URL’s) u anchor text u

Images in Web Pages u Images appear when page is loaded, with u Image files for web pages are of type GIF or JPG u Image files are loaded via links, with some text

Programming u The Client-Server Model u Compiling versus Interpreting u Embedding JavaScript code in a web page u The Syntax or grammar of a P.L. (programming language) –Variables – numbers and strings and booleans –Operators – arithmetic and comparison –Concatenating strings with the overloaded + operator –Expressions – modifying precedence with parentheses –Statements – the assignment operator, the terminal semicolon

Translating a Program to ML u Assembler Language (AL) u High Level Languages (HLL’s) Interpreting – Translate and execute on the fly Compiling – Translate source program to object program, then execute it, retaining translation for subsequent execution

JavaScript Objects Thus, var foo = new Object() Objects may contain primitives of type number, string, or boolean other objects ! methods, or functions Thus, function foobar (){ statement; … }

Creating Forms with HTML …

Processing Forms with JavaScript Events, such as onclick and onchange Functions as event handlers Local variables in functions Converting strings to numbers with parseFloat() Arrays, as with var numbers = new Array() The elements array, automatically, for all of the items in the form selectedIndex for pull-down menus

Arrays u The array is a special kind of object var foo = new Array ( ); where the items in foo are indexed by integer values, thus foo[1], foo[j], foo[2*k+3]…  If the first index value is 0, it is a standard array, as with elements[ ] and options[ ]  A property of an array is its size, as with foo.length

Basic Tags for Tables … …

Attributes of TableTags u … ALIGN, BGCOLOR, BORDER, CELLPADDING, CELLSPACING, HEIGHT, WIDTH u … ALIGN, VALIGN, BGCOLOR u … ALIGN, VALIGN, BGCOLOR, COLSPAN, ROWSPAN

Control Structures u Sequential Processing do A, then B, then C, … u Conditional Processing (branching or selection) if A is true, then do B, else do C u Iterative Processing (looping or repetition) while A is true, do B {and test A again}

Conditional Processing Comparison operators Boolean variables Logical operators for and, or, not if (boolean condition) { statement; … } else { statement; … }

Iterative Processing u Must have three components - Initialize the loop control variable (lcv) –Test the lcv for termination –Update the lcv to next value u Thus, we have the for statement for (j = 0 ; j < 10 ; j += 1) { statement; } u We also have the while statement j = 0; while (j < 10) { statement; j += 1; }

Understanding Iteration u Word Problems To compute the number of days in the years days = 0; for (years = 1950 ; years <= 2000 ; years++) if (years % 4 == 0) days += 366; else days += 365; u Tracing Iteration for (j = 1 ; j <= 3 ; j++) for (k = 0 ; k < j ; k++) document.write (j + “ ” + k + “ ”);

Functions u Function definition (in the HTML head), thus function foobar (a, b, c) { statement; } where a,b,c are formal parameters. u Function invocation or function call, thus foobar (5, j, “Hello”); where the values in parentheses are actual parameters; when foobar is called, a=5, b=j, and c=“Hello”

Cookies u Name - Value pairs are just text strings! u When server responds to client request, it sends cookie to be stored on client. u When browser sends request to server, it retrieves cookie (if present) for server. u The GOOD for customizing user interface to server for implementing shopping carts u The BAD without user knowledge or consent contribute to junk mail and spamming u JS code to SetCookie(), GetCookie(), getCookieVal(), DeleteCookie()

Sources of Errors u Typing errors u Syntax errors – incorrect grammar syntax is how a message is given u Logical errors – incorrect semantics semantics is the meaning u Poor algorithms u Bad input values – GIGO u Incorrect specification of the problem

Computer Ethical Issues u Privacy versus security u Spamming u usage u Hacking u Ownership and piracy …