DGIN 5100 Fall 2021
Lab 6: JavaScript Basics [HTML, CSS, JS]
Learning Outcomes:
- Become comfortable with JavaScript syntax, creating variables and using operators.
- Understand how to create and use simple JS Functions, and pass parameters.
- Understand flow control and conditionals.
Instructions:
- For this lab, you will be learning the basics of JavaScript. Specifically, you will be creating variables, manipulating
data and printing out results in the browser’s JS Console. - For this lab, you will not be modifying any data on the webpage but rather working around the script tag and using
the browser console to work with data. This is a common technique used by developers when debugging JavaScript
code. See Brightspace Lab 6 module.
- For this lab, you will be expected to create functions to carry out the following operations:
1. Common calculation function:
(a) This function should accept three parameters, i.e., value1, value2 and the operation type. A result should
be logged based the operation type used.
For example, if the function name is calculate( ) and the following 3 parameters are passed
calculate(10,50,’add’), then a result of ’60’ should be printed to the JS Console. A similar approach
should be expected for other basic operation types such as ‘subtract’, ‘multiply’, and ‘divide’:
calculate(10,50,’add’) should display 60
calculate(100,20,’subtract’) should display 80
calculate(10,20,’multiply’) should display 200
calculate(100,20,’divide’) should display 5
2. Finding whether a number is even or odd:
(a) This function should accept only one parameter, which should be a number. Depending on the number
passed, an ‘even’ or ‘odd’ result should be displayed on the JS Console. (Hint: you need to use the mod
operator for this)
3. Display whether a number is even or odd from an array:
(a) This function should accept an array of numbers, and check all the numbers in the array in order to log
whether the number is even or odd for all the numbers.
Note: There is no UI expected from this lab submission. The functions you create for this lab are simply expected to
return a value and print it in the browser’s JS Console. However, if you want to create a UI and know how to access
the document object and fetch data from input form/page you can go ahead and take that extra step (which will be a
topic covered in Lab 6), but no marks will be deducted if you do not create a UI.
Lab 6 Page 1 of 3 Instructions
DGIN 5100 Fall 2021
Submission Guidelines
- For this lab, you will need to submit your work through Timberlea AND Brightspace as follows:
Submitting your Work through Timberlea
• As part of this lab, you will need to create a ‘lab6’ directory inside of your ‘dgin5100’ directory on
Timberlea. See Lab 1 instructions on how to log onto Timberlea using an FileZilla, and create directories.
• Once you have completed your lab, upload your work into your ‘lab6’ directory on Timberlea.
Note: You will need to ensure your submission includes all required files needed for your Lab 4 (i.e.,
image files, stylesheets, folders), and that your new directory and individual files have the correct folder
permissions(i.e., 755) and file permissions applied (i.e., 644), respectively.
• Your Lab 6 submission will be expected to follow proper folder structure, i.e., images should be inside an
‘image’, ‘images’, or ‘img’ folder, CSS stylesheets should be inside a ‘styles’ or ‘css’ folder, and JS scripts
should be inside a ‘script’ or ‘js’ folder.
• Ensure you have set the proper file and folder permissions for your Lab 6 work.
Note: In order for your files to be accessible through a browser for testing and grading, you must ensure
you are using the correct file permission settings on your files and folders. On a shared server, such as
Bluenose, it is recommended to use ‘755’ (i.e., rwxr-xr-x) on folders, and ‘644’ (i.e., rw-r--r--) on
individual files. You can set your file permissions easily through an FTP client by right clicking on the
file or folder you want to set specific permission settings. Depending on your FTP client, you will need to
click on ‘Get Info’ or ‘File Permissions’. Once on the file permissions window, you can simply enter
the numeric value described above.
• Visit https://web.cs.dal.ca/~yourcsusername/dgin5100/lab6/ on any browser and ensure you can view
your work.
Note: Failure to submit your work through Timberlea will result in a grade of ZERO (0). Failure to
ensure your work is remotely accessible through a web browser, using the specified URL will result in a
grade of ZERO (0). • No validation is required for this lab as JS cannot be validated as HTML and CSS can be.
• Test your lab to ensure cross-browser compatibility. In this case, you are looking for your functions to be
consistent across browsers.
Submitting your Work through Brightspace
• Download the README template available on Brightspace. See Resources section on left-hand side menu
on Brightspace. There are TWO versions of this template, you may use whichever you feel more comfortable
with.
• Edit the README template to include any citations for your code and/or images used for this Lab.
Note: If the work you are submitting as part of your Lab is work done by you without the use of any
external sources, then please specify so within your README file.
Lab 6 Page 2 of 3 Instructions
DGIN 5100 Fall 2021
• Depending on the version of the template you chose, rename your README file as:
L#_LastName_FirstName_README.md OR L#_LastName_FirstName_README.txt
Note: Ensure your README file includes the URL to your Lab for remote access.
• Submit your README file through the corresponding Lab assignment dropbox on Brightspace.
Marking Rubric
The following grading criteria will be used for marking your lab:
Dimensions Does Not Meet Expectations
Somewhat Meets
Expectations Meets Expectations Exceeds Expectations