- [Instructor] We've already had a bit of experience
with methods from the previous chapter,
and computer properties from the last video.
And the difference is in how they cache
the values that are generated.
So, let's take a look at the difference
by adding something to our slug here.
So what I'll do is, I'll create another
computed property, here.
And I'm going to call it now,
and for now I'll have it return, just a couple of dashes.
And then I'll come here to slugetize,
and add myself a dash
plus whatever I get from now.
So, that's actually going to add three dashes.
That's the case, so, let's now
return something more meaningful.
So to return to date, I'm going to create a variable
called date and make that equal to new date
and then I can return
using the date, the hours.
Alright, so date.gethours should get us
the hour number, it's in 24 hour sort of code.
Let's also go ahead and add
minutes and seconds.
It's unfortunately because these are numbers
it's going to just add 'em all as if they were numbers
which they are, but this is not going to look great.
So we need to actually put these in a string function
and just paste them in there.
Okay this is looking messy, so let's go ahead
and sort of put them in separate lines.
And to make that look nice we're going to have to use
a parenthesis here.
So it needs to return as a single expression.
So we need to do this to it.
So now you can see that we're returning
the hours, minutes and seconds.
So this is okay, but I don't know if you can tell
that as I type something else in here,
this value is never going to change.
A computer property will calculate things that are
reactive just fine, but this date right here
is not a reactive method.
It's only going to happen at the very beginning
of this application getting built.
And so that's the difference
between computer properties and methods.
A method will always get calculated
and a computer function, it'll only calculate
if we're using variables that are reactive,
which is not the case.
Which is really not bad because maybe this is fine
being calculated at the time that you begin
this slugetize sort of page.
But if you wanted to sort of react to the time,
then we need to actually create this as a method.
So let's do that.
It's almost exactly the same.
And we'll get rid of it here
and we'll go and add methods
and then we'll paste our now method.
It's the only one there,
so we can delete that last semi colon.
Think everything looks pretty good.
And we need to call it now, like this,
because it's not a property anymore,
it's actually a method.
So it looks exactly the same, but take look at what happens
if I keep on typing.
You can see that this number right here,
keeps on getting incremented as soon as I type
some things in here.
So now 59, or 511
and if I keep on typing,
every time I adjust this slugetize slug,
it's going to calculate this.
So it's going to be a little bit smarter
about when it needs to update something.
And as I mentioned there isn't a right or a wrong way
of when you should use compute it versus method,
it's just dependent on how often
you want something to update.