up

2016-11-14 16:31:21 +03:00 · 2016-11-14 16:31:21 +03:00 · f99574f53b
commit f99574f53b
parent 3defacc09d
178 changed files with 530 additions and 271 deletions
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/extended-clock.js
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/extended-clock.js
@ -0,0 +1,14 @@
+function ExtendedClock(options) {
+  Clock.apply(this, arguments);
+  this._precision = +options.precision || 1000;
+}
+
+ExtendedClock.prototype = Object.create(Clock.prototype);
+
+ExtendedClock.prototype.start = function() {
+  this._render();
+  var self = this;
+  this._timer = setInterval(function() {
+    self._render();
+  }, this._precision);
+};
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.md
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.md
@ -0,0 +1,4 @@
+Наследник:
+
+[js src="extended-clock.js"]
+
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.view/clock.js
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.view/clock.js
@ -0,0 +1,32 @@
+function Clock(options) {
+  this._template = options.template;
+}
+
+Clock.prototype._render = function render() {
+  var date = new Date();
+
+  var hours = date.getHours();
+  if (hours < 10) hours = '0' + hours;
+
+  var min = date.getMinutes();
+  if (min < 10) min = '0' + min;
+
+  var sec = date.getSeconds();
+  if (sec < 10) sec = '0' + sec;
+
+  var output = this._template.replace('h', hours).replace('m', min).replace('s', sec);
+
+  console.log(output);
+};
+
+Clock.prototype.stop = function() {
+  clearInterval(this._timer);
+};
+
+Clock.prototype.start = function() {
+  this._render();
+  var self = this;
+  this._timer = setInterval(function() {
+    self._render();
+  }, 1000);
+};
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.view/extended-clock.js
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.view/extended-clock.js
@ -0,0 +1,14 @@
+function ExtendedClock(options) {
+  Clock.apply(this, arguments);
+  this._precision = +options.precision || 1000;
+}
+
+ExtendedClock.prototype = Object.create(Clock.prototype);
+
+ExtendedClock.prototype.start = function() {
+  this._render();
+  var self = this;
+  this._timer = setInterval(function() {
+    self._render();
+  }, this._precision);
+};
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.view/index.html
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/solution.view/index.html
@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html>
+
+<head>
+  <title>Часики в консоли</title>
+  <meta charset="utf-8">
+</head>
+
+<body>
+
+  <script src="clock.js"></script>
+
+  <script src="extended-clock.js"></script>
+
+  <script>
+    var lowResolutionClock = new ExtendedClock({
+      template: 'h:m:s',
+      precision: 10000
+    });
+
+    lowResolutionClock.start();
+  </script>
+
+</body>
+
+</html>
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/source.view/clock.js
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/source.view/clock.js
@ -0,0 +1,32 @@
+function Clock(options) {
+  this._template = options.template;
+}
+
+Clock.prototype._render = function render() {
+  var date = new Date();
+
+  var hours = date.getHours();
+  if (hours < 10) hours = '0' + hours;
+
+  var min = date.getMinutes();
+  if (min < 10) min = '0' + min;
+
+  var sec = date.getSeconds();
+  if (sec < 10) sec = '0' + sec;
+
+  var output = this._template.replace('h', hours).replace('m', min).replace('s', sec);
+
+  console.log(output);
+};
+
+Clock.prototype.stop = function() {
+  clearInterval(this._timer);
+};
+
+Clock.prototype.start = function() {
+  this._render();
+  var self = this;
+  this._timer = setInterval(function() {
+    self._render();
+  }, 1000);
+};
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/source.view/extended-clock.js
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/source.view/extended-clock.js
@ -0,0 +1,13 @@
+function extend(Child, Parent) {
+  Child.prototype = inherit(Parent.prototype);
+  Child.prototype.constructor = Child;
+  Child.parent = Parent.prototype;
+}
+
+function inherit(proto) {
+  function F() {}
+  F.prototype = proto;
+  return new F;
+}
+
+// ваш код
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/source.view/index.html
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/source.view/index.html
@ -0,0 +1,35 @@
+<!DOCTYPE HTML>
+<html>
+
+<head>
+  <title>Часики в консоли</title>
+  <meta charset="utf-8">
+</head>
+
+<body>
+
+  <!-- исходные часы, от них нужно унаследовать -->
+  <script src="clock.js"></script>
+  <script>
+    var clock = new Clock({
+      template: 'h:m:s'
+    });
+    clock.start();
+
+
+    /* ... ваш код для ExtendedClock */
+
+    /*
+	Надо: часы, которые тикают раз в 10 секунд (точность 10000)
+    var lowResolutionClock = new ExtendedClock({
+        template: 'h:m:s',
+        precision: 10000
+    });
+
+    lowResolutionClock.start();
+    */
+  </script>
+
+</body>
+
+</html>
--- a/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/task.md
+++ b/1-js/9-object-inheritance/08-class-inheritance/4-clock-class-extended/task.md
@ -0,0 +1,13 @@
+importance: 5
+
+---
+
+# Класс "расширенные часы"
+
+Есть реализация часиков на прототипах. Создайте класс, расширяющий её, добавляющий поддержку параметра `precision`, который будет задавать частоту тика в `setInterval`. Значение по умолчанию: `1000`.
+
+- Для этого класс `Clock` надо унаследовать. Пишите ваш новый код в файле `extended-clock.js`.
+- Исходный класс `Clock` менять нельзя.
+- Пусть конструктор потомка вызывает конструктор родителя. Это позволит избежать проблем при расширении `Clock` новыми опциями.
+
+P.S. Часики тикают в браузерной консоли (надо открыть её, чтобы увидеть).