Embedded Files
Now you will learn the more advanced skills you will need when you get to year 1
For Part 2 JavaScript skills you must use GitHub Codespaces
Your teacher will give you a link to the GitHub Classroom assignment
Task 12 - While loops
Task 12 - While loops
Learning Goal - We are learning how to:
Use a while loop to repeat a section of code while a condition is met.
By the end of this topic you will have:
Gone through the slides.
Copied your template from task 1.
Update the header comments and console.log()
Created a program that:
Inside a while loop, asks the user if they would like to continue with the loop.
If they answer:
y (for yes) then the loop will continue and display the message:
'Loop will repeat again'
When they stop saying "y" the loop ends and it will display the message:
'End of loop'
Below this while loop add another while loop that does the same thing as the first but uses a confirm statement to check whether the user wants to continue.
Hint - this will use a boolean variable
By the end of this activity, you will have two while loops that do a similar task but use different JavaScript statements.
Is one way easier for the user to use than the other?
Task 13 - Validation
Task 13 - Validation
Learning goal - We are learning how to:
Only allow valid input from the user.
By the end of this topic you will have:
Gone through the slides.
Copied your code from task 10 - activate via button.
Update the header comments and console.log()
Created a program that calculates the most expensive chocolate bar that the user can afford.
Ask the user their name, loop this until the user enters a valid user name. If they enter an invalid user name show an error message.
Ask the user their age loop this until the user enters a valid user age. If they enter an invalid user name show an error message.
Ask the user how much pocket money they have from 1 to 5. If they do not enter a valid number within the range 1 to 5, display an error message.
Calculate the most expensive chocolate bar the user is able to buy, given how much pocket money they have:
Mars bar - $1
Moro bar - $2
King Size Crunchy - $3
Dairy Milk Block - $4
Lindt Block - $5
Task 14 - Constants
Task 14 - Constants
Learning goal - We are learning:
The difference between, variables, constants and literal values and the benefits of using constants over literal values.
By the end of this topic you will have:
Gone through the slides
Copied your code from the last task.
Update the header comments and console.log()
Gone through the code and replace any hardcoded values with constants.
Task 15 - Arrays
Task 15 - Arrays
Learning goal - We are learning how to:
Use arrays to sort a list of items and access the different values.
By the end of this topic you will have:
Gone through the slides and watched all the videos.
Copied your code from the last task.
Update the header comments and console.log()
Created a program that uses one ARRAY to hold the chocolate bar names and another to hold the prices
Create the name array with the following values,
Mars bar
Moro bar
King Size Crunchy
Dairy Milk Block
Lindt Block
Create the price array with the following Values:
$2
$2.50
$3
$6
$7
Use these arrays to display the menu. Show a message that says:
"Welcome to the shop, you can buy
Mars bar for $2
Moro bar for $2.50
... "
Next, use the arrays to work out the most expensive chocolate bar the user can afford with their pocket money.
As in the previous task:
Ask the user their name, and loop this until the user enters a valid user name. If they enter an invalid user name show an error message.
Ask the user their age loop this until the user enters a valid user age. If they enter an invalid user name show an error message.
Show a list of available chocolate bars using an array.
Ask the user how much pocket money they have from 1 to 10. If they do not enter a valid number within the range 1 to 10, display an error message.
Use the arrays to calculate the most expensive chocolate bar the user is able to buy, given how much money they have.
What is the advantage of using an array over using hard-coded values inside an if statement?
Task 16 - Cancel & exiting the progam
Task 16 - Cancel & exiting the progam
Learning goal - We are learning how to:
Exit the program if the user clicks cancel.
By the end of this topic you will have:
Gone through the slides and watched all the videos.
Copied your code from the last task.
Update the header comments and console.log()
Followed the steps in the slide to allow the user to cancel when being asked to enter their name.
Followed the steps in the slide to allow the user to cancel when being asked for their age and pocket money.
Task 17 - Update HTML with JavaScript
Task 17 - Update HTML with JavaScript
Learning goal - We are learning how to:
use JavaScript to change the HTML page
By the end of this topic you will have:
Gone through the slides.
Copied your code from the last task.
Update the header comments and console.log()
Replace the Alerts with updates to the HTML page
You might want to create a paragraph to display the messages
Task 18 - Get input from HTML with a form
Task 18 - Get input from HTML with a form
Learning goal - We are learning how to:
use HTML forms to get input instead of prompts
By the end of this topic you will have:
Gone through the slides and watched all the videos.
Copied your code from the last task.
Update the header comments and console.log()
Replace the prompts with a form
When the form is submitted the html page is updated to show the message.
Task 19 - Validating your input
Task 19 - Validating your input
Learning goal - We are learning how to:
use HTML forms to validate input
By the end of this topic you will have:
Gone through the slides
Copied your code from the last task.
Update the header comments and console.log()
Add validation to all your inputs
Task 20 - Testing for boundary & invalid cases
Task 20 - Testing for boundary & invalid cases
Learning Goal - We are learning how to:
Use a testing plan to ensure our program handles boundary (both valid and invalid) and invalid cases.
By the end of this topic you will have:
Gone through the slides and watched all the videos.
The teacher will share this testing plan with you through Google Classroom. There should be at least 4 test cases for boundary and 4 for invalid.
Before we start the project we are going to learn a bit about how to make a usable website
Once you have completed all of these tasks, get them checked by the teacher and then you can start part two of the project. This will give you a chance to get creative and show off what you can do!
Once you have completed all of these tasks, get them checked by the teacher and then you can start part two of the project. This will give you a chance to get creative and show off what you can do!
Page updated
Report abuse