View Full Version : Teaching JavaScript and book examples don't work

11-11-2006, 07:40 PM
I'm teaching a general computer literacy course and we just started a section on programming in Javascript. The point is just to give the students some idea of what's involved, see how to think this way and that type of thing. The problem is my programming experience was long ago in Quick Basic. I understand all the book, but I need to be able to answer student questions about why something they do doesn't work.

To start with, I'm typing in all the examples in the book and running them -- this becomes something I can show in class. The end product of these several chapters in the text is a program that allows "purchase" of latte, cappuccino, or Americano (var drink) in several different sizes (var ounce) and strengths (var shots). There also a var taxRate and it will calculate the var price. The starting point is just to show the calculation of one drink, so drink, shots, and ounce are initialized.

I've typed the code exactly from the book, spent several hours going over it, had my wife read it back to me letter by letter and the alert (price); NEVER works. I just can't see what's wrong. I put another alert outside of the <script></script> for what's in the book (alert ("something is still wrong")) and that one I CAN always see (so popups aren't blocked and that kind of stuff)

Here's the exact code from the book (http://herrick.huntingdon.edu/js/bean_V0.htm) (except my extra alert...) unless we've completely missed something proofreading!!!

If I take OUT all the if statements, and initialize price, the thing works fine so the calculation part is OK. Here's the for that (http://herrick.huntingdon.edu/js/bean_V0-2.htm). The correct result appears

<this is my first time here, and I thought posting the URL might be better than just posting the code here, but didn't know if I should put the code here also, so I did....>

<script language = "Javascript">
var drink = "latte";
var shots = 2;
var ounce = 12;
var price;
var taxRate = 0.088;
if (drink == "espresso")
price = 1.40;
If (drink == "latte" || drink == "cappuccino"){
if (ounce == 8)
price = 1.95;
if (ounce == 12)
price = 2.35;
if (ounce == 16)
price = 2.75;
if (drink == "Americano")
price = 1.20 + .3 * (ounce/8);
price = price + (shots -1) * .50;
price = price + price * taxRate;
<script language = "Javascript">
alert ("There is still a problem")

11-11-2006, 08:00 PM
Your second "if" is capitalized, and because javascript is case-sensitive this will break your script.


11-11-2006, 09:12 PM
Your second "if" is capitalized, and because javascript is case-sensitive this will break your script.I figured it was something like that. I can't believe I missed it!!!! Thanks!!!!

11-14-2006, 12:14 AM
heeheh - i feel your pain, as I'm sure most of us here do!

Javascript is not compiled and most of us start off programming it in notepad or similar (such as a web page design app). And Javascript is unforgiving in many ways, especially to newcomers.

So, can I make a suggestion re debugging Javascript to help you out? It never seems to get much of a mention in Javascript circles but Microsoft brought out the "Express" versions of their Development toolset last year, and there is one for Web Dev called "Visual Web Developer Express 2005".

And it's totally Free!

I mention it because its a full featued IDE (designed for ASP.NET but don't let that put you off) and you can use it to put together straight HTML pages, as well as ASP if you want.

Now, the reason I'm recommending it is because it comes with a debugger for all languages it supports, including javascript!

You can kiss goodbye to "alert" statements to debug your code - you can set breakpoints, step through your code and dynamically inspect the values of every variable and every object.

There is one little "gotacha" tho (well, two actually)...depending on the file type you are using (HTML, XHTML, js, ASPX etc) you may have to invoke the debugger by placing the term "debugger;" somewhere in your code.

Other than that tho, I would point this tool out as the #1 learning aid to all this as it will help no end with debuging AND it has the best intellisense (where code options are given as you type) I've seen for javascript. To be fair, that feature is still rubbish for more complex scripts but even as it is, it would still be a great boon for learning. Also you should be aware that the intellisense (and the debugger) will show the Internet Explorer object tree only (sounds obvious I know but I feel I should point it out).

But all in all it really is a great "general purpose" web tool and as i said, its totally free. If you are learning Javascript and are getting frustrated (as we all have at some point i'm sure) then do yourself a massive favour and get this tool.

11-14-2006, 01:47 PM
Have the admins install Firefox with Firebug and you will have an easier time debugging JavaScript errors.