diff --git a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.md b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.md index e69de29b..dcb4ffe5 100644 --- a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.md +++ b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.md @@ -0,0 +1 @@ +[js src="solution.view/extended-clock.js"] diff --git a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/clock.js b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/clock.js index 8009273e..d701c0ca 100644 --- a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/clock.js +++ b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/clock.js @@ -1,9 +1,9 @@ class Clock { constructor({ template }) { - this._template = template; + this.template = template; } - _render() { + render() { let date = new Date(); let hours = date.getHours(); @@ -15,7 +15,7 @@ class Clock { let secs = date.getSeconds(); if (secs < 10) secs = '0' + secs; - let output = this._template + let output = this.template .replace('h', hours) .replace('m', mins) .replace('s', secs); @@ -24,11 +24,11 @@ class Clock { } stop() { - clearInterval(this._timer); + clearInterval(this.timer); } start() { - this._render(); - this._timer = setInterval(() => this._render(), 1000); + this.render(); + this.timer = setInterval(() => this.render(), 1000); } } diff --git a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/extended-clock.js b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/extended-clock.js index 4eb12381..ca613ca5 100644 --- a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/extended-clock.js +++ b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/extended-clock.js @@ -2,11 +2,11 @@ class ExtendedClock extends Clock { constructor(options) { super(options); let { precision=1000 } = options; - this._precision = precision; + this.precision = precision; } start() { - this._render(); - this._timer = setInterval(() => this._render(), this._precision); + this.render(); + this.timer = setInterval(() => this.render(), this.precision); } }; diff --git a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/index.html b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/index.html index 7ac1db71..f76a4362 100644 --- a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/index.html +++ b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/solution.view/index.html @@ -1,23 +1,12 @@ - + + - - Console clock - + - - - - - - + lowResolutionClock.start(); + diff --git a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/clock.js b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/clock.js index 8009273e..d701c0ca 100644 --- a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/clock.js +++ b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/clock.js @@ -1,9 +1,9 @@ class Clock { constructor({ template }) { - this._template = template; + this.template = template; } - _render() { + render() { let date = new Date(); let hours = date.getHours(); @@ -15,7 +15,7 @@ class Clock { let secs = date.getSeconds(); if (secs < 10) secs = '0' + secs; - let output = this._template + let output = this.template .replace('h', hours) .replace('m', mins) .replace('s', secs); @@ -24,11 +24,11 @@ class Clock { } stop() { - clearInterval(this._timer); + clearInterval(this.timer); } start() { - this._render(); - this._timer = setInterval(() => this._render(), 1000); + this.render(); + this.timer = setInterval(() => this.render(), 1000); } } diff --git a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/index.html b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/index.html index b48a2a00..c0609858 100644 --- a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/index.html +++ b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/source.view/index.html @@ -1,34 +1,21 @@ - + + - - - - - + lowResolutionClock.start(); + */ + diff --git a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/task.md b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/task.md index 05da4538..bbc2c6a4 100644 --- a/1-js/09-classes/03-class-inheritance/2-clock-class-extended/task.md +++ b/1-js/09-classes/03-class-inheritance/2-clock-class-extended/task.md @@ -6,6 +6,9 @@ importance: 5 We've got a `Clock` class. As of now, it prints the time every second. + +[js src="source.view/clock.js"] + Create a new class `ExtendedClock` that inherits from `Clock` and adds the parameter `precision` -- the number of `ms` between "ticks". Should be `1000` (1 second) by default. - Your code should be in the file `extended-clock.js`