Home HTML Data Types DOM JavaScript JS Debugging Review Ticket

College Board Big Idea 1

Identifying and Correcting Errors (Unit 1.4)

Become familiar with types of errors and strategies for fixing them

  • Review CollegeBoard videos and take notes on blog
  • Complete assigned MCQ questions if applicable

Code Segments

Practice fixing the following code segments!

Segment 1: Alphabet List

Intended behavior: create a list of characters from the string contained in the variable alphabet

Code:

%%js

var alphabet = "abcdefghijklmnopqrstuvwxyz";
var alphabetList = [];

for (var i = 0; i < alphabet.length; i++) {
	alphabetList.push(alphabet[i]);
}

console.log(alphabetList);
<IPython.core.display.Javascript object>

What I Changed

I changed the code to add in (alphabet.length) and (alphabet[i]). since the intended behaviour of the code is to create a list from the string contained in the variable “alphabet”, this corrected code helps to interate over all the letters in the var alphabet string and push each letter into the alphabetLIst to that its a perfect list of characters in the console log.

Segment 2: Numbered Alphabet

Intended behavior: print the number of a given alphabet letter within the alphabet. For example:

"_" is letter number _ in the alphabet

Where the underscores (_) are replaced with the letter and the position of that letter within the alphabet (e.g. a=1, b=2, etc.)

Code:

%%js

var alphabet = "abcdefghijklmnopqrstuvwxyz";
var alphabetList = [];

for (var i = 0; i < alphabet.length; i++) {
	alphabetList.push(alphabet[i]);
}

let letterNumber = 10;

for (var i = 0; i < alphabetList.length; i++) {
	if (i === letterNumber - 1) { 
		console.log(alphabetList[i] + " is letter number " + letterNumber + " in the alphabet");
	}
}

// Should output:
// "e" is letter number 5 in the alphabet
<IPython.core.display.Javascript object>

What I Changed

I changed alphabetList to alphabetList.length, and -1 to the letter number as the letterNumber represents position of the letter in the series of alphabets and nor the index, i = 0. In JS script most varibles start with an index of 0, and continue on, 0,1,2,3,4,5….etc and thus by -1 to the letterNumber ensures that we find the right letter in the list when a=0.

Since i = 0 is a for loop, that iterates through the alphabet , to get the corresponding letter the code was changed to alphabetList[i] which accesses the correct sequence of letters. Console log was the used to print out the final results.

Segment 3: Odd Numbers

Intended behavior: print a list of all the odd numbers below 10

Code:

%%js

let evens = [];
let i = 1;

while (i <= 10) {
  evens.push(i);
  i += 2;
}

console.log(evens);
<IPython.core.display.Javascript object>

What I Changed

I changed the original numbers from i += 2 to i += 2 and also changed let i = 0; to let i = 1;. This starts off with i being 1 and adds to to it every time the loop iterates through itself.

BELOW NOT EDITED

The intended outcome is printing a number between 1 and 100 once, if it is a multiple of 2 or 5

  • What values are outputted incorrectly. Why? The values that were outputted incorrectly included that off 100 not being the output list as i was set to be less than 100 and not less than or equal to 100, and also the repetitiveness of numbers that were divisible by both 2 and that of 5, like 10 or 20 or example they were show o the results twice.
  • Make changes to get the intended outcome. And thus the changes that I made to fix the two erros was to set i is less than or equal to 100 and to add an else if statement after the if segment of the code which makes the code work better as it removes redundances like 100 or 50 and outputs them only once.
%%js

var numbers = []
var newNumbers = []
var i = 0

while (i <= 100) {
    numbers.push(i)
    i += 1
}
for (var i of numbers) {
    if (numbers[i] % 5 === 0)
        newNumbers.push(numbers[i])
    else if (numbers[i] % 2 === 0)
        newNumbers.push(numbers[i])
}
console.log(newNumbers) 


<IPython.core.display.Javascript object>

Challenge

This code segment is at a very early stage of implementation.

  • What are some ways to (user) error proof this code?
  • The code should be able to calculate the cost of the meal of the user

Hint:

  • write a “single” test describing an expectation of the program of the program
  • test - input burger, expect output of burger price
  • run the test, which should fail because the program lacks that feature
  • write “just enough” code, the simplest possible, to make the test pass

Then repeat this process until you get program working like you want it to work.

%%js

var menu =  {"burger": 3.99,
         "fries": 1.99,
         "drink": 0.99}
var total = 0

//shows the user the menu and prompts them to select an item
console.log("Menu")
for (var item in menu) {
    console.log(item + "  $" + menu[item].toFixed(2)) //why is toFixed used?
}
//ideally the code should support mutliple items
var selecteditem = "fries"


console.log(`Test: Selected item'${selecteditem}'`)
console.log("Expected Output: $" + menu[selecteditem].toFixed(2));

if (menu[selecteditem] !== undefined) {
    total += menu[selecteditem];
}

//code should add the price of the menu items selected by the user 
console.log("total: $" + total.toFixed(2));
<IPython.core.display.Javascript object>
%%js

var movies =  {"Interstellar": 15.99,
         "The Martian": 19.99,
         "Jusrrasic Park": 4.99,
         "The Shawshank Redemption": 3.99,
         "The Dark Knight": 5.99,
         "Star Wars: The Empire Strickes Back": 1.99,
         "Avatar: The Way of Water": 7.99}
         
var total = 0

console.log("Movies")
for (var item in movies) {
    console.log(item + "  $" + movies[item].toFixed(2)) 
}

var selecteditem = "Avatar: The Way of Water"


console.log(` Selected item'${selecteditem}'`)

if (movies[selecteditem] !== undefined) {
    total += movies[selecteditem];
}

console.log("total: $" + total.toFixed(2));
<IPython.core.display.Javascript object>

Hacks

  • Fix the errors in the first three segments in this notebook and say what you changed in the code cell under “What I Changed” (Challenge is optional)