Class Activities

Goal

By the end of today, you will be able to:

understand and use vocabulary needed to talk about objects
understand and use Date objects in different ways
write code that performs conditional execution based on dates

Objects Summary

The readings covered a lot of ground; let's take a minute to step back and see the big ideas:

Objects are an important way of organizing information in modern programming languages.
An object is a collection of information about a single thing, such as a date, a document, an element of a document, an image, a Google map location, a Facebook post, ...
Objects sometimes have methods: special functions that belong to the object to operate on its data and provide behavior for the object. For example, a date object has methods to extract the day, date, and month, and also to set those values.

Date Objects

As a concrete and useful example of objects, we'll start with date objects.

You create them with new Date()
With no arguments, the new object represents the moment of its creation.
There are many ways to create date objects for different moments. Usually, we use a string representing a date and, optionally, a time. If the time is omitted, it's the same as 0:00:00.
They have methods like getDay() and getFullYear() to retrieve the data.
They also have methods like setDay() and setFullYear() to modify the data. (We'll rarely use these.)
The .toLocaleString() method returns a string with a formatted presentation of the date and time, which is very convenient, but also a bit inflexible. We can build our own code to format dates and times.

Quiz Question Nr. 1

Which of the following expressions does not involve an object method?

```
var d = new Date();
d.getTime()
```
```
var d = new Date();
d.setMonth(3)
```
```
var d = new Date();
alert(d);
```
```
(new Date()).toLocaleString();
```

Quiz Question Nr. 2

In which of the following code excerpts, is there no object method involved? There might be more than one correct answer.

var name = prompt("what is your name?");

alert("your name has "+name.length+" letters");

document.getElementById("username").innerHTML = "Harry Potter";

```
var e = 2.7182818;
e.toFixed(2);
```

Quiz Question Nr. 3

Which of the following statements will not define a Date object?

```
var now = new Date();
```

var date = new Date("10/20/2015 03:45");

```
var date = new Date("10/20/2015");
```
```
They all define Date objects.
```

Exercise 1

Write some JavaScript code that prompts the user to enter their birthday (like "5/5/2005") and displays a message with the day of their birthdate. For example, if someone was born on May 5th, 2005, they'll see the message "You were born on a Thursday." To get the name of the day, you can use the dayName() function that was described in the reading for today.

Exercise 2

Write some JavaScript that prompts the user to enter a date string, and then displays a message if it is a Friday the 13th. Either way, it should alert the user. The Date object methods .getDay() and .getDate() will be useful. Use the execution box below to test it. Test dates like the following: "2/13/2015", "3/13/2015" and "4/13/2015". You can use the same execution box above.

Exercise 3

Write some JavaScript that uses the current clock and tells whether the 11:10 class is over (after 12:20). The 9:50 class could just check for hour >= 11, which is too easy. You can use the same execution box above.

More Information on Dates

Dates have a method .getTime() that returns the number of seconds since 1/1/1970, which is the epoch. Differences between pairs of these is a convenient way to determine time differences, such as how long a computation took:

var before = new Date();
aVeryLongComputation();
var after = new Date();
var diff = after.getTime() - before.getTime();
alert("that took "+diff+" milliseconds");

Summary

We hope you had fun with the object Date. As you can see from today's exercises, dates combined with conditionals will allow us to have pages that do different things on different dates or times.

create Date objects with different constructor arguments.
format Date objects in different ways
use Date objects in boolean expressions

Solutions

Will be posted later, visit again after .

Quiz questions:

1. C  (Technically, alert() is a method, but we have never described it as such)
2. A, B  Both C and D use methods
3. D: they all define dates
4. D  (A has "/15" instead of "/2015", B compares a date and a string, C is for November)

Exercise 1:

    var dateString = prompt("Enter your birthday","5/5/2005");
    var dateObject = new Date(dateString);
    var day = dateObject.getDay();
    var dayOfWeek = dayName(day);
    alert("You were born on a "+day+" which is a "+dayOfWeek);

Exercise 2:

    var dateString = prompt("Enter a date string","2/13/2015");
    var dateObject = new Date(dateString);
    if (dateObject.getDate() == 13 && dateObject.getDay() == 5) {
        alert("Yikes, Friday the 13th!");
    } else {
        alert("Whew, not Friday the 13th!");
    }

Exercise 3:

    var now = new Date();
    var hour = now.getHours();
    var mins = now.getMinutes();
    if (hour > 12 || hour == 12 && mins > 20) {
        alert("Outta here!!");
    } else {
        alert("Hang on, not yet");
    }

Objects and Date()