JavaScript Pt2 - Prototypes Solution doesn't work

JavaScript
1

I just started with the second JavaScript course after I finished part 1. I love the video’s and everything is explained very well. It’s a lot of fun.

Could someone help me understand the solution of the section ‘Prototypes’. It’s the exercize where we remodify the Stopwatch(). I found it difficult to understand and it took me some time to make it work only a little bit. I got an error, and after watching the solution I still don’t understand. I copied his code but it doesn’t seem to work eigher:

function Stopwatch(){

 let startTime, endTime, running, duration = 0;

  Object.defineProperty(this, 'duration', {

    get: function(){ return duration},

    set: function(value){ duration = value; }

  })

  Object.defineProperty(this, 'startTime', {

    get: function(){ return startTime}

  })

  Object.defineProperty(this, 'endTime', {

    get: function(){ return endTime}

  })

  Object.defineProperty(this, 'running', {

    get: function(){ return running}

  })

} 

Stopwatch.prototype.start = function(){

  if(this.active) 

    throw new Error('Stopwatch has already started');

  this.running = true;

  this.startTime = new Date();

}

Stopwatch.prototype.stop = function(){

  if(!this.running) 

    throw new Error('Stopwatch has already been stopped');

  

  this.running = false;

  

  this.endTime = new Date();

  const seconds = (endTime.getTime() - startTime.getTime()) / 1000;

  this.duration += seconds;

}

Stopwatch.prototype.reset = function(){

  this.startTime = null;

  this.endTime = null;

  this.running = false;

  this.duration = 0;

}

const sw = new Stopwatch();

When I type “sw.start()” in the console twice it doesn’t give an error where it suppose to do so, and sw.running is unaffected after (where it suppose to be set to “true”).

Sorry for the long story, here’s my question: What am I doing wrong?

2

Ok, I’ve watched the video for the 10th time… It still doesn’t work.

In the end Mosh tells us the duration can’t be set because we need to implement a setter. Shouldn’t this then also apply to “running”? We are also updating this value within the start and stop method.

Please help me :slight_smile: I’m a sponge desperate for more information :stuck_out_tongue:

3

if(this.active)
Should this not be:
if(this.running)

4

I watched the video. Is the solution important in this excercise? Isn’t the conclusion changes to improve the code is sometimes creating problems?

5

You are totally right, I used “active” in my code and forgot to change it.

And I think you are right about the conclusion too. I just wanted to make it work without errors and his version doesn’t work at all.

Thanks a lot for the reply!

6

To whom it maybe concern:

  • Remove all the declarations in the function.
  • Modify the duration to display window.duration. (global)
  • Declare ‘duration’ outside the StopWatch() function.
  • In reset, remember to set window.duration to 0.
  • Not perfect but it’s working :smiley:.

My solution:

 function StopWatch() {
  Object.defineProperty(this, 'duration', {
    get: () => window.duration
  });
}

this.duration = 0;

StopWatch.prototype.start = () => {
  if (this.isRunning)
    throw new Error('StopWatch has already started!');
  this.isRunning = true;
  this.timeStart = new Date().getTime();
};

StopWatch.prototype.stop = () => {
  if (!this.isRunning)
    throw new Error('StopWatch has already stopped!');
  this.isRunning = false;
  this.timeStop = new Date().getTime();
  const seconds = (timeStop - timeStart) / 1000;
  this.duration += seconds;
};

StopWatch.prototype.reset = () => {
  this.timeStart, this.timeStop, this.isRunning, window.duration = 0;
};
1 Like