List of Figures

Chapter 1: Getting Started

Figure 1-1: A program, such as a racing game, interacts with both a computer and users and makes sure that the computer takes the steps requested by the users.
Figure 1-2: The HTML scaffolding appears as an empty document in a Web browser.
Figure 1-3: You know that the one-line program has run because you can see the text displayed in the browser.
Figure 1-4: Click the Don’t Append button to save your HTML file.

Chapter 2: Understanding Types, Variables, and Statements

Figure 2-1: By storing values in variables, each operation doesn’t have to be written in code.
Figure 2-2: Concatenation appends the string on the right of the string concatenation operator to the end of the string on the left of the operator.
Figure 2-3: The contents of the trekQuote variable is displayed.
Figure 2-4: It’s easy to display quotations using escape sequences.
Figure 2-5: You can include HTML tags in JavaScript strings.
Figure 2-6: JavaScript implicitly converts numbers to strings rather than the other way around.
Figure 2-7: The modulo operator combines remainder arithmetic with assignment.
Figure 2-8: Results of the increment operations

Chapter 3: Using Conditional Statements

Figure 3-1: The JavaScript alert statement displays a message box when executed.
Figure 3-2: The alert message box displays the results based on the default values of the HTML form elements.
Figure 3-3: When you enter new values in the HTML form, they’re evaluated using the conditional expression.
Figure 3-4: Using an if statement to test how JavaScript orders lowercase and uppercase strings
Figure 3-5: A high-level flow chart of the Rock, Scissors, and Paper game
Figure 3-6: The Web page (user interface) for Rock, Scissors, and Paper
Figure 3-7: The computer played rock and the human played scissors—a win for the computer!
Figure 3-8: Both players chose rock; it’s a tie.
Figure 3-9: The computer played paper, and the human chose scissors and wins!
Figure 3-10: This simple demonstration shows how switch statements work.
Figure 3-11: Flow chart of the whoWon function
Figure 3-12: The computer wins again.

Chapter 4: Working with Loops

Figure 4-1: The prompt function displays a box that accepts user input.
Figure 4-2: The string that will be reversed is entered in a prompt box.
Figure 4-3: The reverse text is displayed in the browser.
Figure 4-4: The while loop decrements from 10 to 1.
Figure 4-5: The user is prompted for a text string to reverse.
Figure 4-6: The reversed text string is displayed.
Figure 4-7: If you try to assign the length property of an empty object, you’ll get a syntax error.
Figure 4-8: The Web browser provides an explanation of JavaScript errors and the line number in the program where they occurred.
Figure 4-9: If the user enters an empty string, the browser display looks kind of weird.
Figure 4-10: Nested loops are used to draw a tree using Xs and Os.

Chapter 5: Understanding Functions

Figure 5-1: In an HTML document, the <br> tag is used to create a line break.
Figure 5-2: The function adds a line break to the text passed to it.
Figure 5-3: The user can enter a number in each of the text boxes.
Figure 5-4: The sum of the three numbers is displayed.
Figure 5-5: The function can be used with four boxes (or any number of boxes).
Figure 5-6: The sum of the numbers passed to the function is displayed.
Figure 5-7: The user enters the number of Fibonacci numbers to display.
Figure 5-8: By the eighteenth generation, there starts to be plenty of rabbits!
Figure 5-9: The text entered by the user is displayed in the message box.
Figure 5-10: The confirm method displays a box with text and OK and Cancel buttons.
Figure 5-11: The return value of the confirm method is either true or false , and you can branch depending on the value (in the figure, the text message displayed depends on the button clicked).
Figure 5-12: The default text in the prompt box depends on the argument sent to the prompt method.
Figure 5-13: The user enters text in the prompt box.
Figure 5-14: The text entered by the user in the prompt box is displayed in the Web page.

Chapter 6: Programming with Arrays

Figure 6-1: The text value in the array element is displayed.
Figure 6-2: The defined elements of the sparse array
Figure 6-3: The undefined values of the array
Figure 6-4: The value of the elements of an array are displayed as a text string.
Figure 6-5: The contents of the stack (the top two items) are displayed.
Figure 6-6: The HTML page lets you push a text item onto the stack, displays the current state of the stack, and lets you pop the stack.
Figure 6-7: Enter an item in the leftmost text box and click Push to push it onto the stack.
Figure 6-8: The contents of the stack are displayed in the select list.
Figure 6-9: When the user pops an item from the stack by clicking the Pop button, the popped item is displayed in the rightmost text box.
Figure 6-10: If you attempt to pop a stack with nothing on it, an appropriate message is displayed.
Figure 6-11: The values contained in the array of arrays are displayed.
Figure 6-12: Reversing, sorting, and concatenating an array
Figure 6-13: Default sort comparison and custom numeric comparison
Figure 6-14: Default sort comparison and case-insensitive comparison
Figure 6-15: An alert box shows that the box was checked.
Figure 6-16: When the Check All button is clicked, the form elements array is used to check all the check boxes.
Figure 6-17: When the check box is unchecked, an alert box is displayed.
Figure 6-18: When the Clear Checks button is clicked, the form elements array is used to uncheck all the check boxes.

Chapter 7: Working with Objects

Figure 7-1: Each human society is implemented as an object using a general class as a template.
Figure 7-2: The user enters a string in a prompt box.
Figure 7-3: The length of the string the user entered is displayed.
Figure 7-4: The user is asked to confirm the URL.
Figure 7-5: The document.location property is set to open the URL.
Figure 7-6: The window.close() method is used to close the browser window following a confirmation from the user.
Figure 7-7: The value of the HREF attribute (the URL that the link points to) changes when the onMouseOver event is fired.
Figure 7-8: The associative array of the properties of the window object is displayed.
Figure 7-9: The navigator object associative array
Figure 7-10: The document object associative array (shown partially)
Figure 7-11: The object instance’s values of its height and width properties and the return value for its calcArea method are displayed in the browser.
Figure 7-12: The properties of a Rectangle instance shown using its associative array
Figure 7-13: The custom toString method of the Rectangle object returns some cute text.
Figure 7-14: The Tchatshke Gulch user interface
Figure 7-15: The Auction object contains an array of Bid objects.
Figure 7-16: The Tchatshke Gulch user interface (with no values)
Figure 7-17: Creating an auction at the Tchatshke Gulch
Figure 7-18: Placing a bid at the Tchatshke Gulch
Figure 7-19: The bid value is shown in the Tchatshke Gulch user interface.
Figure 7-20: Bids are shown together with the associated maximum proxy bid.
Figure 7-21: And the winner is...

Chapter 8: Understanding Events and Event-Driven Programming

Figure 8-1: The Visual Studio .NET development environment loaded with a Visual Basic .NET project
Figure 8-2: The letter entered by the user in the text box is displayed in an alert box.
Figure 8-3: The letter t is singled out for unfair treatment.
Figure 8-4: The confirmation box asks the user whether they want to submit the form.
Figure 8-5: The cross-browser version of the application uses a button onClick event as a “faux” form onSubmit event.
Figure 8-6: The action specified in the form tag takes place when the user clicks OK.
Figure 8-7: Watching events fired by the text boxes in Mozilla
Figure 8-8: Watching events fired by the text boxes in Netscape
Figure 8-9: Watching events fired by the text boxes in Internet Explorer
Figure 8-10: The custom onSame event is fired when the two text strings entered by the user are the same.
Figure 8-11: The setInterval method is used to display the time at one-second intervals.
Figure 8-12: The setInterval method is used to automatically update proxy bids.

Chapter 9: Manipulating Strings

Figure 9-1: The String object’s link method is a quick way to create a hyperlink.
Figure 9-2: No lawyer will make it past Saint Peter by varying the case in a text string!
Figure 9-3: The Playing with Strings user interface is shown with the words in a string capitalized.
Figure 9-4: The function counts the number of words in a string.
Figure 9-5: The words in the text string are reversed.
Figure 9-6: The string has been reversed.
Figure 9-7: The first letters of the words in the reversed string have been capitalized.
Figure 9-8: Using the regular expression pattern shows that the user input isn’t in date format.
Figure 9-9: It’s easy to use regular expressions to make sure that user input is in the proper format.
Figure 9-10: Regular expressions can be used to trim a string.

Chapter 10: Debugging and Exceptions

Figure 10-1: In JavaScript, anything divided by zero is the special value Infinity.
Figure 10-2: If there are syntax errors on the page, an error icon appears on the status bar in Internet Explorer.
Figure 10-3: Double-clicking the error icon opens a message box that describes the error and provides a location.
Figure 10-4: The JavaScript console provides information about syntax errors in Netscape and Mozilla.
Figure 10-5: The error message in Internet Explorer provides a location for the error and a somewhat opaque description.
Figure 10-6: The JavaScript console in Netscape provides a helpful description of the error.
Figure 10-7: The count of words is one less than the actual number of words entered.
Figure 10-8: The alert box shows that the problem is a one-off error in the loop iteration variable.
Figure 10-9: You can use a separate diagnostic window to review values without interrupting program execution.
Figure 10-10: The “Object expected” error is caught and handled.
Figure 10-11: The “Alas, I loved and lost!” error has been thrown and caught.
Figure 10-12: Error number 42 has been caught.
Figure 10-13: The non-42 error is caught by the general handler.

Chapter 11: Programming with JavaScript

Figure 11-1: The user enters the password in a prompt box.
Figure 11-2: If the file pointed to by the password input isn’t found, an HTTP 404 error is generated.
Figure 11-3: The password is LearnToProgram.
Figure 11-4: When the password (the name of the destination page) is correctly entered, the page will open.
Figure 11-5: The butterfly has no pattern.
Figure 11-6: The butterfly is “filled in” with the first pattern.
Figure 11-7: The butterfly is now “dressed” using the plaid pattern.
Figure 11-8: The slide show page loads showing a single, static image.
Figure 11-9: The slide show displays images in index order or at random; in either case, the index value of the image is displayed on the status bar.

Learn How to Program Using Any Web Browser
Learn How to Program Using Any Web Browser
ISBN: 1590591135
EAN: 2147483647
Year: 2006
Pages: 115
Authors: Harold Davis

Similar book on Amazon © 2008-2017.
If you may any questions please contact us: