Assignments JS.OOP.1

Handing In Assignments

You must hand in by using git

Hand In by git

  • Create an empty repo on bitbucket.org, gitlab.com, or github.com,
  • git push your local repo to the above remote repo.
  • For node assignments please put the line(s)

    node_modules/

    into your .gitignore file.

Send a mail to with:

  • The word 'handin <subjectname>' in the subject line of your mail
  • The url of your repo(s).

Assignment JS.OO.0

Create a JavaScript object for tunes, songs. The have titles, composers, and year as properties as well as an array of performers.

The Tune object must be used in an HTML5 page allowing the user to enter tunes data through a form. The entered Tune objects must be stored in an array. The page has a div element, where the array of tunes is displayed. Whenever the array is changed, the display must automatically be updated.

Optional extra: Consider introducing a possibility for deleting tunes from the tunes array.

Assignment JS.OO.1

Write a Planet class. Use it to create ten planets storing planetary information. You may find the info on: http://www.opencourse.info/astronomy/introduction/05.motion_planets/#sidereal%20period and http://www.opencourse.info/astronomy/introduction/05.motion_planets/#aphelion . You don't need more than the sample output suggests. Treat the Sun as the first planet, with all values set to zero. Write a web information page with a form that allows the user to choose a planet via a radio button. Create a change event with a handler that writes the planet's information on the screen.

Sample output for Jupiter:

Distance = 5.2028 AU
Sidereal Period = 11.862 years
Synodic Period = 398.9 days
Eccentricity = 0.048
Orbital Inclination = 1.31°

Assignment JS.OO.2

Write an HTML5 page with a form for entering credit card information. On submitting the form the content must be validated. For this purpose you must create a credit card object holding the following:

  • Credit card number, re the given test numbers below.
  • Expiration info, month/year
  • name,
  • cvv. Must be a three digit number except when the the credit card is from AMEX, where it must be 4 digits long.
  • A method for checking the expiration info,
  • a method for checking the validity of the number re rules described below. The method must return true or false.
  • a method checking that the cvv number is syntactically correct

Correct information should be sent to http://x15.dk/hitme.php. Incorrect should not be submitted but return an appropriate error message asking the user for correction.

You may refer to https://www.codeproject.com/tips/253704/test-credit-card-account-numbers for numbers suitable for testing.

Rules for Credit Card Number Validation

The checking mechanism is know as the Luhn algorithm[7] also known as the "modulus 10" or "mod 10" algorithm. Your validity checking method must implement the following formulation of the algorithm using an exemplary number 7992739871x

  1. From the rightmost digit (excluding the check digit) and moving left, double the value of every second digit. The check digit is neither doubled nor included in this calculation; the first digit doubled is the digit located immediately left of the check digit. If the result of this doubling operation is greater than 9 (e.g., 8 × 2 = 16), then add the digits of the result (e.g., 16: 1 + 6 = 7, 18: 1 + 8 = 9) or, alternatively, the same final result can be found by subtracting 9 from that result (e.g., 16: 16 − 9 = 7, 18: 18 − 9 = 9).
  2. Take the sum of all the digits. In the example the sum will be 67 + x.
  3. If the total modulo 10 is equal to 0 (if the total ends in zero) then the number is valid according to the Luhn formula; otherwise it is not valid. Again in the example only a 3 as the last digit would make a valid number.
Example 10.15. Code Outline
'use strict';
class CreditCard {
    constructor(ccno, expdate, name, cvv) {
        this.ccnumber = ccno;
        //...
    }

    isValid() {
        // code for checking
        // return false if invalid
        // else return true
        return true;
    }
}

const validate = function(e) {
    let ccnumber = document.getElementById('ccno');
    let expdate = document.getElementById('exp').value;
    // more values from form
    let cc = new CreditCard(ccnumber.value, expdate, 'Niels', '666');
    if (!cc.isValid()) {
        ccnumber.focus();
        e.preventDefault();
        return false;
    } /* if (! other tests)

    } */ else {
        return true;
    }
}

const init = function() {
    document.getElementById('formid').addEventListener('submit', validate);
}

window.addEventListener('load', init);

Assignment JS.OO.4

In the beginning were the natural numbers, ℕ, they are the numbers used for counting. Later we got what is today know as the integers, ℤ, by adding zero, 0, and the negative numbers. Later again we got the fractions, in mathematical speak the rational numbers ℚ, and all was good.

The rational numbers are the integers plus the fractions. Fractions are represented as the ratio between two integers. As an example, 3/7 is a rational number. The 3 is called the numerator. The 7 is called the denominator. Integers are fractions with a denominator of 1.

In this assignment you are going to create an object for rational numbers, and several methods for doing calculations with them. You see, some of us love the rational numbers because they are beautiful and exact. The real numbers ℝ, the numbers with decimals, are approximations.

  1. Create an object Rational. It must have two properties, numerator, and denominator. The creating code must give values to these two properties.
  2. If the caller does not provide parameters, the function should create the fraction 0/1.
  3. Write a method toString() that will present the fraction as the string "3/7" for example. If the fraction is an integer it should be presented as a string with only the numerator, ie without the "/1".
  4. Write a method negate which will reverse the sign of the fraction from minus to plus, or vice versa.
  5. Write a method invert which will invert the fraction by swapping the numerator and the denominator. This is sometimes the reciprocal value of the fraction.
  6. Write a method toFloat. It must return the value of the fraction as a floating point number with decimals, as approximate asd they may be.
  7. Write a method reduce. It must reduce the fraction as much as possible. The calculation is done by dividing the numerator and the denominator with their greatest common denominator, the biggest number that divides both. I shall provide you with a function gcd(n, d) that will return this number given two integers as input.
  8. Write four methods add, sub, mul, and div that will add, subtract, multiply, and divide two fractions that are both represented as Rational objects. The calculations must always end with reducing the resulting fractions.
  9. /**
     * The world's oldest non trivial algorithm:
     * Euclid's Elements, Book 7, ca. 300 BC.
     * Based on
     * if r = the remainder from the division a/b,
     * then a og b's commom divisors are the same as b's and r's.
     * This means that gcd(a,b) = gcd(b,r)
     *
     * By doing this continuously we get:
     * gcd(36,20) = gcd(20,16) = gcd(16,4) = gcd(4,0)
     * It is possible to prove that we will end with a pair
     * where the second number is 0. When that happens
     * the first number of the pair equals their gcd.
     *
     * This is the quintessential example of recursive function programming!
     */
    
    /**
     * Euclid's algorithm
     *
     * calling sequence
     * let n = parseInt(prompt('Give me an integer:'));
     * let d = parseInt(prompt('Give me an integer:'));
     * n = Number(n);
     * d = Number(d);
     * gcd(n, d);
     */
    let gcd = function (a, b) {
        if (b == 0) {
            return a;
        } else {
            return gcd(b, a % b);
        }
    }
    
  10. In order to test your code, of course you must create an HTML5 page explaining the fraction calculation rules to children in 3rd-4th grade. This page must have a fraction calculator to support the explanations.


[7] This adapted from https://en.wikipedia.org/wiki/Luhn_algorithm. If you refer to that beware of the psudocode implementation. It is in a programming language quite different from JavaScript