JavaScript/Debugging Challenges

These debugging challenges are written in JavaScript, and designed to complement the units: ICAB4225A Automate processes and ICAT4221A Locate equipment, system and software faults

Challenge Set 1 - Lexical Errors

Lexical errors are introduced when the programmer enters symbols that are not part of the programming language. Unlike when you misspell a word in English, this inevitably leads to a breakdown in programming communications. See if you can see (or find) the lexical errors in the following code snippets...

1

<script type="text/javascript">
    var num1 = 2;
    var num2 = 3;
    var product = num1 x num2;
    alert("the product of " + num1 + " and " + num2 + " is " + product);
</script>

2

<script type="text/javascript">
    function display message()
    {
        alert("Hello World!");
    }
 </script>
 <input type="button" value="Click me!" onclick="displaymessage()" />

3

<script type="text/javascript">
    var x = 0;
    var y = hello;
    alert("first valuable is " + x + " second valuable is " + y);
</script>

4

<script type="text/javascript">
    var d = new date();
    var time = d.getHours();
    if (time < 10) 
    {
        document.write("<b>Good morning</b>");
    }
    else
    {
        document.write("<b>Good day</b>");
    }
</script>

5

<script type="text/javascript">
    var a: 2;
    var b: 3;
    var c: 4;
    if (a > b && b > c || c > a)
    {
        document.write("C is the largest, followed by B");
    }
    else
    {
        document.write("I am unsure what happened");
    }
</script>

Challenge Set 2 - Syntactic Errors

A syntax error occurs when you use the right symbols, but in a way that doesn't make sense to the compiler or interpreter. Something like the English sentence: "You don't program good"

1

<script type="text/javascript">
    var x;
    x = prompt("What is 5 x 5?");
    while (x != 25) do
    {
        alert("Wrong answer");
        x = prompt("What is 5 x 5?", 0);
    }
    document.write("Right, the answer is " + x);
</script>

2

<script type="text/javascript">
    // If the time is less than 10,
    // you will get a "Good morning" greeting.
    // Otherwise you will get a "Good day" greeting.
    var d = new Date();
    var time = d.getHours();
    else (time < 10)
    {
        document.write("Good morning!");
    }
    if
    {
        document.write("Good day!");
    }
 </script>

3

<script type="text/javascript">
    var txt = "We are the so-called "Vikings" from the north.";
    document.write(txt);
</script>

4

<script type="text/javascript">
    // Is the variable a equal to or greater than b?
    var a = 8;
    var b = 2;
    // It seems so, let's check!
    if (a => b)
    {
        document.write("Yes, A is equal to or greater than B");
    }
</script>

5

<script type="text/javascript">
    function startTime()
    {
        var today = new Date();
        var h = today.getHours();
        var m = today.getMinutes();
        var s = today.getSeconds();
        // Add a zero in front of numbers < 10
        m = checkTime(m);
        s = checkTime(s);
        document.getElementById('txt').innerHTML = h + ":" + m + ":" + s;
        t = settimeout('startTime()', 500);
    }
    
    function checkTime(i)
    {
        if (i < 10) 
        {
            i = "0" + i;
        }
            return i;
    }
</script>
 
<body onload="startTime()">

6

<script type="text/javascript">
    var d = new Date()
    (var time = d.getHours()
    if (time < 10) 
    {
        document.write("<b>Good morning</b>")
    }
    else
    {
        document.write("<b>Good day</b>")
    }
</script>

Challenge Set 3 - Execution Errors

Execution errors occur when the program has the correct syntax and lexicon, but you're making the wrong requests to get the results you desire.

1

<script type="text/javascript">
    var weekdays = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday");
    for (i = 1; i < 8; ++i)
    {
        document.write(weekdays[i] + ", ");
    }    
</script>

2

<script type="text/javascript">
    var d = new Date();

    function saygidday()
    {
        var d;
        var time = d.getHours();
        if (time < 10)
        {
            document.write("Good morning!");
        }
        else
        {
            document.write("Good day!");
        }
    }
</script>

3

<script type=text/javascript>
    document.write("Show the factorials from 1 to 10<br />");
    for (i = 1, fact = 1; i < 11; i++, fact *= i);
    {
        document.write(i + "!=" + fact + "<br />");
    }
</script>

4

<script type="text/javascript">
    var num1 = prompt("Write a number", " "); // Try number 10
    var num2 = 10;
    if (num1 > num2)
    {
        document.write("The number you wrote" +num1+ " is less than 10");
    }
    else
    {
        document.write("The number you wrote" +num1+ " is more than 10");
    }
</script>

Challenge Set 4 - Logic Errors

These are errors introduced Through faulty design. Once again, the syntax is correct, but the results are unexpected, usually because you haven't considered the data being processed. These are the hardest errors to spot, and often the most expensive to correct.

1

<script type="text/javascript">
    document.write("counting from 1 to 10... ");
    for (i = 1; i < 11; i += 1)
    {
        document.write(++i + " ");
    }
</script>

2

<script type="text/javascript">
    var i = 0;
    for (i = 0; i <= 10; i++)
    {
        document.write("The number is " == i);
        document.write("<br />");
    }
</script>

3

<script type="text/javascript">
    var a = 2;
    document.write("We are going to see if a = 4 <br />");
    if (a = 4)
    {
        document.write("Yes, variable a does equal 4");
    }
    else
    {
        document.write("No, variable a does not equal 4");
    }
</script>

JavaScript Objects

Resources