csc 112 intro to computer programming in javascript spring 2005
TRANSCRIPT
![Page 1: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/1.jpg)
CSC 112
Intro to ComputerProgramming in
JavaScript
Spring 2005
![Page 2: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/2.jpg)
Internet and WWW
Internet and WWW are not the same – Internet includes email and other things
Internet is the computers and the means by which they physically connect to each other.
World Wide Web is the logical means of accessing the files on these computers, primarily as web pages.
![Page 3: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/3.jpg)
Using the World Wide Web Browsers
Netscape Navigator Internet Explorer
Plug-ins Java
Macromedia Flash Acrobat Reader …
Search Engines Yahoo and many others
![Page 4: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/4.jpg)
Internet Protocols
TCP/IP – Transmission Control Protocol / Internet Protocol
FTP – File Transfer Protocol http – Hypertext Transfer Protocol telnet – for remote login to other
computers, with local computer as dumb terminal
![Page 5: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/5.jpg)
IP Addresses Example – 123.45.67.89 For specific computers on the Internet Information is passed between them in
packets A named address (next slide) is converted to
an IP address by a Domain Name Server (DNS)
![Page 6: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/6.jpg)
Named AddressesURL’s – Uniform Resource Locators
http://www.music.sony.com/Music/index.html
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
![Page 7: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/7.jpg)
Hypertext Markup Language
Describes with tags how web page should be formatted for display by browser
Container tags, thus <BODY> and </BODY> Non container tags, thus <BR> or <HR> Tags must be properly nested
![Page 8: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/8.jpg)
Basic Skeleton of an HTML Page
<HTML><HEAD> <TITLE> … </TITLE></HEAD><BODY> …</BODY></HTML>
![Page 9: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/9.jpg)
Tags for Lists For an unordered list <UL> <LI> <LI> … </UL>
For an ordered list <OL> <LI> <LI> …
</OL>
![Page 10: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/10.jpg)
Attributes of HTML Tags
Describe how to accomplish a result Attributes may or may not have values, as in
<P ALIGN=left> …. </P> BODY attributes include colors for links and
for background FONT attributes include color and size
![Page 11: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/11.jpg)
Hypertext Links <A HREF=“some URL“> anchor text </A>
(Absolute or relative URL’s)
<A HREF=“#fragment identifier”>
anchor text </A>
<A NAME=“a named anchor”> </A>
![Page 12: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/12.jpg)
Images in Web Pages
Images appear when page is loaded, with
<IMG SRC=“URL for image file”>
Image files for web pages are of type
GIF or JPG
Image files are loaded via links, with
<A HREF=“URL for image file”> some text </A>
![Page 13: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/13.jpg)
Programming The Client-Server Model Compiling versus Interpreting Embedding JavaScript code in a web page 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
![Page 14: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/14.jpg)
Translating a Program to ML Assembler Language (AL)
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
![Page 15: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/15.jpg)
JavaScript ObjectsThus, var foo = new Object()
Objects may contain primitives of type number, string, or boolean other objects ! methods, or functionsThus, function foobar (){ statement; statement;
… }
![Page 16: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/16.jpg)
Creating Forms with HTML<FORM … > <INPUT TYPE=text …> <INPUT TYPE=button …> <INPUT TYPE=reset …> <INPUT TYPE=checkbox …> <INPUT TYPE=radio …> <SELECT …> <OPTION …> <OPTION …> … </SELECT> <TEXTAREA …> </TEXTAREA></FORM>
![Page 17: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/17.jpg)
Processing Forms with JavaScript
Events, such as onclick and onchangeFunctions as event handlersLocal variables in functionsConverting strings to numbers with parseFloat()
Arrays, as with var numbers = new Array()The elements array, automatically, for all of
the items in the formselectedIndex for pull-down menus
![Page 18: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/18.jpg)
Arrays 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
![Page 19: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/19.jpg)
Basic Tags for Tables
<TABLE> <TR> <TD> <TD> … <TR> <TD> <TD> …</TABLE>
![Page 20: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/20.jpg)
Attributes of TableTags <TABLE> … </TABLE> ALIGN, BGCOLOR, BORDER, CELLPADDING,
CELLSPACING, HEIGHT, WIDTH
<TR> … </TR> ALIGN, VALIGN, BGCOLOR
<TD> … </TD> ALIGN, VALIGN, BGCOLOR, COLSPAN,
ROWSPAN
![Page 21: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/21.jpg)
Control Structures Sequential Processing
do A, then B, then C, … Conditional Processing (branching or
selection)
if A is true, then do B, else do C Iterative Processing (looping or repetition)
while A is true, do B {and test A again}
![Page 22: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/22.jpg)
Conditional ProcessingComparison operatorsBoolean variablesLogical operators for and, or, not
if (boolean condition) { statement; statement; … } else { statement; statement; … }
![Page 23: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/23.jpg)
Iterative Processing Must have three components - Initialize the loop control variable (lcv)
– Test the lcv for termination– Update the lcv to next value
Thus, we have the for statement for (j = 0 ; j < 10 ; j += 1) {
statement; statement; }
We also have the while statement j = 0; while (j < 10) { statement; j += 1; }
![Page 24: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/24.jpg)
Understanding Iteration Word Problems
To compute the number of days in the years 1950-2000
days = 0; for (years = 1950 ; years <= 2000 ; years++)
if (years % 4 == 0)
days += 366;
else
days += 365;
Tracing Iteration for (j = 1 ; j <= 3 ; j++)
for (k = 0 ; k < j ; k++)
document.write (j + “ ” + k + “<BR>”);
![Page 25: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/25.jpg)
Functions Function definition (in the HTML head), thus
function foobar (a, b, c) { statement; statement; }
where a,b,c are formal parameters.
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”
![Page 26: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/26.jpg)
Cookies Name - Value pairs are just text strings! When server responds to client request, it
sends cookie to be stored on client. When browser sends request to server, it
retrieves cookie (if present) for server. The GOOD
for customizing user interface to serverfor implementing shopping carts
The BADwithout user knowledge or consentcontribute to junk mail and spamming
JS code to SetCookie(), GetCookie(), getCookieVal(), DeleteCookie()
![Page 27: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/27.jpg)
Sources of Errors Typing errors Syntax errors – incorrect grammar syntax is how a message is given Logical errors – incorrect semantics semantics is the meaning Poor algorithms Bad input values – GIGO Incorrect specification of the problem
![Page 28: CSC 112 Intro to Computer Programming in JavaScript Spring 2005](https://reader034.vdocuments.net/reader034/viewer/2022051619/56649e555503460f94b4d0fe/html5/thumbnails/28.jpg)
Computer Ethical Issues Privacy versus security Spamming Email usage Hacking Ownership and piracy
…