|
4 days
50% Lecture/50% Lab
Basic Level
JavaScript programming is useful for creating dynamic Web pages. It is used to detect and react to user initiated events, such as when the user moves his mouse over a link or image, or presses on a button or key. JavaScript can also improve a Web site with navigational aids, scrolling messages, rollovers, dialog boxes, dynamic images, shopping carts, etc. It has built-in objects that can be used to perform arithmetic calculations, string operations, manipulate the date and time, and validate form input such as e-mail addresses, zip codes, credit cards, etc.
Upon completion of this course, students will be able to:
- read, write, customize, and debug JavaScript programs.
- understand JavaScript's role and responsibilities; e.g. making Web pages dynamic, using dialog boxes, handling events, forms, images, and links, manipulating windows and frames, form validation, etc.
- learn how to use JavaScript core objects to create arrays, manipulate the time and date, perform mathematical functions, work with strings, etc.
- use the navigator and document object models to manipulate, navigate and program windows, frames, forms, images, etc.
- use JavaScript event handlers to respond to user initiated events
- use regular expressions to validate form data
- debug scripts
JavaScript Programming is an introductory course recommended for people developing Web pages for either personal, business, or commercial use.
Students need to be familiar with basic programming constructs and how to use a browser such as Internet Explorer or Netscape.
This is an intensive, interactive course, which is approximately 50% lecture and 50% lab. Questions are highly encouraged. On the final day, students are given access to a zipped file containing all of the solutions to the labs and the examples used throughout the notebook.
Day One
Module 1 -- Introduction to JavaScript
- What is JavaScript Is?
- What JavaScript is Not
- What JavaScript is Used For
- JavaScript and Events
- What Versions? What Browsers?
- Where to Put JavaScript
- JavaScript and External Files
Lab Exercise 1
Module 2 -- Script Setup
- The HTML Document and JavaScript
- Syntactical Details
- Case Sensitivity
- Free Form and Reserved Words
- Statements and Semicolons
- Comments
- The <script> Tag
- Generating HTML and Printing Output
- Strings and String Concatenation
- The write() and writeln() methods
- About Debugging
- Types of Errors
- Debugging Tools
Lab Exercise 2
Module 3 -- The Building Blocks: Data Types, Literals, and Variables
- Data Types
- Primitive Data Types
- Composite Data Types
- Variables
- Valid Names
- Declaring and Initializing Variables
- Dynamically and Loosely Typed Language
- Scope of Variables
- Concatenation and Variables
Lab Exercise 3
Module 4 -- Dialog Boxes
- Interacting with the User
- The alert Box
- The prompt Box
- The confirm Box
Lab Exercise 4
Day Two
Module 5 -- Operators
- About JavaScript Operators and Expressions
- Assignment
- Precedence and Associativity
- Types of Operators
- Number, String or Boolean? Datatype Conversion
- The parseInt() method
- The parseFloat() method
- The eval() method
- Special Operators
Lab Exercise 5
Module 6 -- Conditional Statements and Loops
- Control Structures, Blocks, and Compound Statements
- Conditionals
- If/else
- If/else if
- Switch
- Loops
- The while Loop
- The do/while Loop
- The for Loop
- The for/in Loop
- Loop control
- Nested loops and labels
Lab Exercise 6
Module 7 -- Functions
- What is a Function?
- Function Declaration and Invocation
- Return Values
- Functions as Objects
Lab Exercise 7
Module 8 -- Objects
- What are Objects?
- Object Modules and the Dot Syntax
- Creating an Object with a Constructor
- Properties of the Object
- Methods of the Object
- User-Defined Objects
- The new Operator
- The Object() Constructor
- Creating the Object with a User-Defined Function
- Defining Methods for an Object
- Object Literals
- Manipulating Objects
- The with Keyword
- The for/in Loop
Lab Exercise 8
Day Three
Module 9 -- JavaScript Core Objects
- What are Core Objects?
- Array Objects
- Declaring Arrays
- Properties and Methods
- The Date Object
- Using Date Object Methods
- Manipulating Date and Time
- The Math Object
- Rounding Up and Rounding Down
- Generating Random Numbers
Lab Exercise 9
Module 10 -- The Browser Objects: Navigator, Windows, and Frames
- The Browser Object Model
- The navigator Object
- The window Object
- Frames
- The location Object
- The history Object
- The screen Object
Lab Exercise 10
Module 11 -- The Document Objects: Forms, Images, and Links
- The Document Object Model
- The JavaScript Hierarchy
- The Document Itself
- Introduction to Forms
- HTML Forms Review
- Input Types
- The forms Object
- Naming forms and buttons
- Submitting Fillout Forms
- Programming Input Devices
- Simple Form Validation
- Introduction to Images
- HTML Review of Images
- The image Object
- Introduction to Links
- JavaScript URLs
- The links Object
Exercise 11
Day Four
Module 12 -- Handling Events
- Introduction to Event Handlers
- Creating an Event Handler
- Handling a Window or Frame Event
- Handling a Mouse Event
- Handling Link Events
- Handling Form Events
- Handling Key Events
- Handling Error Events
Lab Exercise 12
Module 13 -- Regular Expressions and Pattern Matching
- What is a Regular Expression?
- Creating a Regular Expression
- The Literal Way
- The Constructor Method
- Properties of the RegExp Object
- String Methods Using Regular Expressions
- The Metacharacters
- The Dot Metacharacter
- The Character Class
- Metasymbols
- Repeating Patterns
- Anchors
- Alternation
- Form Validation with Regular Expressions
- Checking for Empty Fields
- Checking for Numeric Zip Codes
- Checking for Alphabetic Data
- Removing Extraneous Characters
- Checking for Valid Social Security Numbers
- Checking for Valid Phone Numbers
- Checking for Valid E-Mail Addresses
- Credit Card Validation
Lab Exercise 13
|
