Stop Low Resolution Sign

Transcript

Tutorial Area

Transcript of the tutorial.

TOP
Tutorial
          All right then.

So dates in JavaScript are a type of data that fall under the object data type.

So they're objects essentially, which means they're also reference types and not primitive types.

Now dates can be really useful for many things in JavaScript, from creating the date of a blog post

or a signup date to an event date, etcetera.

So in this chapter we're going to learn all about how to create them, format them and do other cool

things with them.

All right then.

So how do we create then a new date object?

Well, to do this, we're going to use what's known as a constructor in JavaScript.

Now there's many types of constructors in JavaScript and they all essentially construct a certain object

type and we'll learn more about them later on when we talk about object oriented programming.

But for now, just know that a constructor is going to generally create a new object for us.

So we're going to use what's known as the date constructor to create an object, a date object.

So let's store this in a constant first of all.

So we'll say const and then call this now because when we create a new date, it automatically assigns

it the date of now, this moment in time when we run the file.

So to do this we say new and then date.

So we've not seen this new keyword either before.

So this goes before a constructor, which is this.

It looks a bit like a function because we invoke it and essentially it is calling a constructor function

to create this object.

But we put this new keyword in front of it to say we want a new object of this date type.

That's what this is doing.

Now, if we log this to the console, we'll say now and press save.

Over here we see this gigantic date.

Okay, so this is the date.

Now we can see March the 20th, 2019 at this time.

So then.

What if we want to check the type of this thing that we've just created?

Well, we can use the type of operator.

So let's say console, dot log and then type of.

Now save that and preview all.

And now we can see that it's an object.

So like I said, the date and times fall under the object data type.

All right then.

So it might be that we don't always want this gigantic string of a date.

When we create a new date, we might just want certain things from it.

Unfortunately, the date object comes packed with methods that we can use to grab certain information

from it.

So what I'm going to do now is just show you a handful of these different methods.

So a little comment, first of all, to say years, months, days and times, because they're the different

things we can grab from this date object.

So in each case, I'm going to log it to the console and we'll do a string to say what we're going to

do, and then we'll do the method.

So the first method I want to show you is called Get Full all year.

So we'll say we want now, which is the date object dot get full year.

So this gets us the full year and if I save it, we can see this right here, 2019.

So we've extracted that from the date object.

So I'm just going to duplicate this now and on the next line I'm going to use get month instead of this.

So get month and change it right here as well.

And no prizes for guessing what this does.

It gets us the month.

But you might be surprised.

We see two.

We don't see March, we see two.

And that's because it's getting us the position of the month in some kind of imaginary array of months,

if you like.

So because JavaScript is zero based, January the 1st month is zero, then February is one, March is

two, April 3rd and so forth.

So by two it means March we get an integer, not a string to say march.

So that's the second one.

Let me duplicate this again.

And in fact, let's do two at a time.

So the first one I'm going to do is going to be get date.

So I'm going to do it there and there and replace this with date.

So the second one is going to be get day.

So we'll replace that and this.

So that's the get day method.

Let's save this and preview so we can see get date that gets us the date of the month the 20th which

it currently is and get day again.

We don't get a string.

It doesn't say Wednesday it just goes from the start, which is Sunday and that is zero.

Monday is one.

Tuesday is two, Wednesday is three.

So this gives us an integer as well.

Okay then.

So now let's do just 2 or 3 more.

I'm going to duplicate this another three times.

And first of all, we're going to do get ours.

So let's line up our cursor next to these two and replace it with ours.

Then we'll replace this with minutes.

And then finally, you probably guessed it seconds.

So let's replace those with seconds.

Okay?

So let's save that and preview.

And now we can see the ours is ten because it's 10 a.m. in the morning, the minutes 51 and the seconds

11.

Okay.

So by the way, this date, you might have noticed it changing.

If I refresh over here, then these things are going to change.

And that's because we make the date object when this file is run.

So when it runs in a browser at that moment in time, that's what the date will be.

So we've seen all these different methods to get different information from this date object, which

is really good.

But I also want to show you a couple more things.

First of all, time stamps.

Now a time stamp is represented in a date by the number of milliseconds since the 1st of January 1970.

And these are really good because they allow us to compare two dates together.

And we're going to see that in action later on.

But I'm going to show you now how to actually get the time stamp.

So we'll say console dot log again.

And this time we want to log out the time stamp and that is going to be oops, the now object dot get

time.

So save it.

This is going to be a gigantic number.

Like I said, the number of milliseconds since the 1st of January 1970.

Okay.

And finally, I want to show you a few date strings, because currently all these things are numbers

right here.

So let me now show you some date strings.

So again, we'll say console dot log.

This time we're going to say now dot two date string.

So let's have a look at that one first.

Save it and we can see this short date right here, which is pretty nice.

Shorter than this thing up here.

It's the first portion of it.

Then I'm going to duplicate this and I'm going to use a different method.

And this time it's going to be two time string.

So the first one was date.

The second one is time, and now we just get the time of day, this portion of the date.

So this gets us the start of it.

This gets us the second part of it over here, including this.

Sorry.

And then finally, I'm going to do one more and that is going to be now dot to local string.

So like this and save and let's refresh and see.

And now we can see the date and this little bit of time in your local area.

So there we go.

That's your little introduction to dates and date objects and how we can get all of this data from them

in the next video.

What I'd like to do is start to talk a little bit more about timestamps, which is this thing.