Programming Week 9 LBSC 690 Information Technology Outline Programming Javascript Project description presentations if time allows Finishing up databases Software Software models aspects of reality Input and output represent the state of the world Software describes how the two are related Examples Ballistic computations Google Microsoft Word Types of Software Application programs e g Powerpoint What you normally think of as a program Compilers and interpreters Programs used to write other programs Operating system e g Windows Vista Manages display CPU memory disk tape Embedded program e g TiVO Permanent software inside some device Programming Languages Used to specify every detail of the model Special purpose Able to specify an entire class of models Spreadsheets Excel Databases Access Oracle General purpose Able to specify any possible model JavaScript Java Perl C C History of Programming Machine language Language that machine can understand Assembly language Assembler changes names to machine code High level languages Compiler Interpreter translates to machine language FORTRAN COBOL C C Javascript Visual programming language Visually arrange the interface components Visual Basic Programming Languages COBOL C Java C Assembly Language Machine Language Hardware JavaScript Machine Language Everything is a binary number Operations Data For instance 00001000 00010101 00001000 00010101 01010110 01010110 ADD first number 21 second number 86 Assembly Language Symbolic instruction codes and addresses Symbolic instruction code ADD Symbolic address SUM1 For instance ADD 21 SUM1 High level Languages Procedural modular Programming Group instructions into meaningful abstractions C Pascal Perl Object oriented programming Group data and methods into objects Naturally represents the world around us C Java JavaScript Programming for the Web PHP Server side Forms encode field values into a URL Web server passes field values to a PHP program Program generates a Web page as a response JavaScript Client side interpreted Human readable source code sent to the browser Web browser runs the program Java applets Client side compiled Machine readable bytecode sent to browser Web browser runs the program Variables Data types Boolean true false Number 5 9 3 1415926 String Hello World A variable holds a value of a specific data type Represented as symbols x celsius In JavaScript var declares a variable var b true create a boolean b and set it to true var n 1 create a number n and set it to 1 var s hello create a string s and set it to hello Operators x reverse the sign of x negation 6 5 Add 6 and 5 numeric Hello World Concatenate two strings 2 1 3 Multiply two values x increase value of x by 1 x 5 x y x 5 set the value of x to be 5 x x y x x 5 Statements In JavaScript instructions end with a semicolon If missing at end of line it is automatically inserted Simple assignment statements celsius 5 9 f 32 Statements that invoke a method Temperature toCelsius 104 Return a value from a method return celsius Functions Reusable code for complex statements Takes one or more values as parameters Returns at most one value as the result function convertToCelsius f var f 60 var celsius 5 9 f 32 c convertToCelsius f return celsius c convertToCelsius 60 function convertToCelsius f var celsius 5 9 f 32 return celsius Algorithms A sequence of well defined instructions designed to accomplish a certain task Derived from the name of the Persian mathematician Al Khwarizmi Basic Control Structures Sequential Perform instructions one after another Conditional Perform instructions contingent on something Repetition Repeat instructions until a condition is met Not much different from cooking recipes Sequential Control Structure a 2 b 3 c a b Conditional Selection Control Structure if gender male greeting Hello Sir else greeting Hello Madam Generating Boolean Results x y x y x y x y x y x y x true if x and y are equal true if x and y are not equal true if x is greater than y true if x is smaller than or equal to y true if both x and y are true true if either x or y is true true if x is false Repetition Control Structure Program Example 1 n 1 while n 10 document writeln n n Program 2 For n 1 n 10 n document writeln n Arrays A set of elements For example the number of days in each month Each element is assigned an index A number used to refer to that element For example x 4 is the fifth element count from zero Arrays and repetitions work naturally together JavaScript HTML HEAD TITLE My first script TITLE HEAD BODY BGCOLOR WHITE H1 SCRIPT LANGUAGE JAVASCRIPT TYPE TEXT JAVASCRIPT document write Hello world SCRIPT H1 BODY HTML Try it at http www umiacs umd edu oard teaching 690 fall08 notes 9 firstscript html Placement JavaScript is usually in the head section head script language JavaScript type text javascript function calculate var num eval document input number value document output number value total script head Handling Events Events Actions that users perform while visiting a page Use event handlers to response events Event handlers triggered by events Examples of event handlers in Javascript onMouseover the mouse moved over an object onMouseout the mouse moved off an object onClick the user clicked on an object HTML Forms Accept input and display output for JavaScript In HTML form name input action Please enter a number input size 10 value name number form form name output action The sum of all numbers up to the number above is input size 10 value name number readonly true form Reads in a value eval function turns it into a number JavaScript code var num eval document input number value document output number value 10 Changes the value in the textbox Hands On Adopt a JavaScript Program Launch a Web browser http www umiacs umd edu oard teaching 690 fall08 hw hw5 selector htm See how it behaves if you are 13 or 65 View source and read the program Save a local copy Make some changes and see how it works Programming Tips Attention to detail Careful where you place that comma semi colon etc Write a little bit of code at a time Add some functionality make sure it works move on Don t try to write a large program all at once Debug by viewing the state of your program Print values of variables using document write Is the value what you expected JavaScript Resources Google javascript Tutorials to learn to write programs Code to do things you want to do Engineering and Physical Sciences Library Term Project Goal is to learn some things